let,const介绍

前言

简单介绍es6/es2015的let和const。

let

定义:let是完美的var。用法类似于var,但是所声明的变量,只在let命令所在的代码块内有效。

1
2
3
4
5
6
7
8
9
{
let p1 = "xiahl01";
var p2 = "xiahl02";
}
p1
//Uncaught ReferenceError: p1 is not defined
// at <anonymous>:1:1
p2
xiahl02
  • 说明let命令申明的p1只在{}代码块内有效。

特点:let与var的异同。

不存在变量提升(Hoisting)

var申明的变量在代码运行之前都存在,即“变量提升”;
let申明的变量则不存在“变量提升”,必须先申明后使用!

不允许重复声明

let不允许在同个作用域内,重复声明同一个变量,否则会报错。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
function a1() {
var a1 = "a1";
let a1 = "a10";
}
//Uncaught SyntaxError: Identifier 'a1' has already been declared
function a2() {
let a2 = "a2";
var a2 = "a20";
}
//Uncaught SyntaxError: Identifier 'a2' has already been declared
function a3() {
let a3 = "a3";
let a3 = "a30";
}
//Uncaught SyntaxError: Identifier 'a3' has already been declared
function a4() {
var a4 = "a4";
var a4 = "a40";
}
//undefined

暂时性死区(Temporal dead zone,简称TDZ)

在代码块内使用let命令声明的变量,如果在该变量之前被使用就进入了TDZ。

1
2
3
4
5
6
var p1 = "xiahl";
{
p1 = 'temp';
let p1;
}
//Uncaught ReferenceError: p1 is not defined(…)

块级作用域(Block-level scope)

内外层代码块作用域互不影响,类似于CSS中的BFC

1
2
3
4
5
6
7
8
9
10
11
function f1() {
let _num = 5;
if (true) {
let _num = 10;
console.log(_num);
}
console.log(_num);
}
f1()
//10
//5

const

定义:声明一个只读的常量。一旦声明,必须赋值并且常量的值就不能改变。其中特点同let命令。

1
2
3
4
const NAME = "xiahl";
NAME
NAME = "xxx";
//Uncaught TypeError: Assignment to constant variable.(…)

小结

ES5声明变量的方法:var命令和function命令。

ES6声明变量的方法:var命令和function命令,新添加的letconst命令、import命令和class命令。

(完)

文章目录
  1. 1. 前言
  2. 2. let
    1. 2.1. 定义:let是完美的var。用法类似于var,但是所声明的变量,只在let命令所在的代码块内有效。
    2. 2.2. 特点:let与var的异同。
      1. 2.2.1. 不存在变量提升(Hoisting)
      2. 2.2.2. 不允许重复声明
      3. 2.2.3. 暂时性死区(Temporal dead zone,简称TDZ)
      4. 2.2.4. 块级作用域(Block-level scope)
  3. 3. const
    1. 3.1. 定义:声明一个只读的常量。一旦声明,必须赋值并且常量的值就不能改变。其中特点同let命令。
  4. 4. 小结
|