1. 变量声明
ES5 只有两种声明变量的方法:var
命令和function
命令。
ES6 新增了let
命令和const
命令声明变量。
let
命令声明变量,声明的变量只能在let
命令所在的代码块中有效。用法类似于var
命令,只不过var
命令声明的变量在全局范围内有效。
如果在代码块之内使用let
命令声明了变量,而在代码块之外调用该变量,则会报错。
const
命令声明一个只读的常量,一旦声明,常量的值就不能改变,所以在声明时必须进行初始化赋值,否则会报错。
注意:
let
命令和const
命令不允许在相同作用域内重复声明同一个变量。const
命令和let
命令声明的变量只在声明的块级作用域内有效。var
命令可以重复声明变量,后声明的变量覆盖先声明的变量。
这里补充说明一下在JS中var
命令声明的变量作用域:
- 在函数外声明的变量是全局变量,如果没有用
var
命令明确声明的,则变量是全局对象window
的可配置属性,可以使用delete
删除,有用var
命令明确声明的变量是不可配置的全局属性,无法删除。 - 在函数内部使用
var
命令声明的变量为局部变量,没有使用var
命令明确声明的变量为全局变量。
2. 变量提升问题
变量提升问题,即变量是否可以在声明之前使用。
var
命令声明的变量会发生变量提升,即变量可以在声明之前使用,值为undefined
。
let
命令和const
命令声明的变量不存在变量提升问题,即所声明的变量一定要在声明后使用,否则报错。
3. 暂时性死区(TDZ)
ES6规定,如果区块中存在let
和const
命令,这个区块对于它们声明的变量就会形成封闭作用域,它们声明的变量不再受外部的影响,必须在声明之后才能被获取和使用。凡是在声明之前就访问这些变量,就会报错。
暂时性死区的解释:(暂时性死区:temporal dead zone,简称TDZ)
解释1:当程序的运行流程进入作用域创建变量,到变量可以被访问之间的一段时间,就称之为“暂时性死区”。
解释2:在代码块内,使用let命令声明变量之前,该变量都是不可用的。这在语法上,称为“暂时性死区”。
4. 块级作用域
4.1 为什么需要块级作用域?
ES5 只有全局作用域和函数作用域,没有块级作用域,这带来很多不合理的场景。
第一种场景,内层变量可能会覆盖外层变量。
var tmp = new Date();
function f() {
console.log(tmp);
if (false) {
var tmp = 'hello world';
}
}
f(); // undefined
上面代码的原意是,if
代码块的外部使用外层的tmp
变量,内部使用内层的tmp
变量。但是,函数f
执行后,输出结果为undefined
,原因在于变量提升,导致内层的tmp
变量覆盖了外层的tmp
变量。
第二种场景,用来计数的循环变量泄露为全局变量。
var s = 'hello';
for (var i = 0; i < s.length; i++) {
console.log(s[i]);
}
console.log(i); // 5
上面代码中,变量i
只用来控制循环,但是循环结束后,它并没有消失,泄露成了全局变量。
4.2 ES6的块级作用域
ES6的块级作用域必须有大括号,如果没有大括号,JavaScript 引擎就认为不存在块级作用域。
ES6 允许块级作用域的任意嵌套。如果存在多层嵌套,则每一层都是一个单独的作用域。
4.3 块级作用域和函数声明
ES5 规定,函数只能在顶层作用域和函数作用域之中声明,不能在块级作用域声明。
ES6允许在块级作用域中声明函数,在块级作用域中,函数声明语句的行为类似于let
,在块级作用域之外不可引用。
书籍链接:ECMAScript6 入门