中午偷个闲做个es6let的使用总结
作用域块
- 在作用域块中声明的变量不受外部的影响,见例子
{
let a= 10;
{
let a= 20;
console.log('子作用域', a);// 20
}
console.log('父作用域', a);// 10
}
- let声明的变量只在let命令所在的代码块中有效,见例子
// 例子一
{
let a= 10;
var b= 20;
}
console.log(a) // ReferenceError: a is not defined.会报引用错误
console.log(b) // 20
//例子二
// 使用var声明,则会提升为外层变量,次例子中的i提升为外层变量,也就是提升到上一个执行上下文
var a = [];
for (var i = 0; i < 10; i++) {
a[i] = function () {
console.log(i);
};
}
a[6](); // 循环执行完后,i被赋值为10,所以最终结果为10
// 使用let申明i,当前的i只在本轮循环有效,所以每一次循环的i其实都是一个新的变量,所以最后输出的是6
// for循环还有一个特别之处,就是设置循环变量的那部分是一个父作用域,而循环体内部是一个单独的子作用域
var a = [];
for (let i = 0; i < 10; i++) {
a[i] = function () {
console.log(i);
};
}
a[6](); // 6
- ES6 的块级作用域允许声明函数的规则,只在使用大括号的情况下成立,如果没有使用大括号,就会报错。
- 考虑到环境导致的行为差异太大,应该避免在块级作用域内声明函数。如果确实需要,也应该写成函数表达式,而不是函数声明语句
'use strict';
{
if (true) // 报错
function func() {
}
}
没有变量提升(这个好理解就不说了)
暂时性死区(借用阮一峰老师的说辞)
- 在使用let声明之前,该变量是不可使用的,不然会报错,见栗子:
{
let a= 10;
{
// 在该作用域里面,a还没有声明完成
console.log(a); // ReferenceError: a is not defined
let a= 20; // 如果这里不声明就不会报错,则a引用的是父作用域的a
console.log(a); // 20
}
}
不允许在作用域内重复申明同一个变量,见例子
// 报语法错误
{
let a= 10;
let a= 20;
}
// 所以不能在函数内部重新声明参数
function func(arg) {
let arg= 20;
}
意义
- ES6 规定暂时性死区和let、const语句不出现变量提升, 主要是为了减少运行时错误,防止在变量声明前就使用这个变量,从而导致意料之外的行为
- 内部变量可能覆盖外层变量
var a= 10;
function func(){
console.log(a); // undefined
if(false) {
var a= 20; // 在该执行上下文里,'变量对像'创建的过程中会做变量提升,确定作用域链,所以console时输出的是内部这个a,并不会改变外层的a,相当于重新申明了一个变量a,指向不同于外层a变量的栈内存的地址,也由于不同的执行上下文,不同的变量对像
}
}
func()
console.log('外层a',a) // 10