JavaScript块级作用域, let, const介绍

let

块级作用域

ES6里增加了let，const, 声明在{}, -> “function,if ,for等” 的变量作用域被限制在块级。（严格模式下 function 变量属于块级作用域）

例:

{
let i = 0;
}
console.log(i);
//报错Uncaught ReferenceError: i is not defined

同时还可以解决闭包问题, 例如我们为10个div绑定点击事件, 肯定会去写一个立即执行函数去解决闭包问题

var oDiv = document.getElementsByTagName('div');
for(var i = 0; i < 10; i++){
(function(j){
oDiv[j].onlick = function(){
alert(j);
}
})(i)
}

但在es6中就可以使用let解决这一问题

var oDiv = document.getElementsByTagName('div');
for(let i = 0; i < 10; i++){
oDiv[i].onlick = function(){
alert(i);
}
}

块级作用域特点

一旦let在作用域中声明变量 就将统治这个作用域

var a = 1;
{
console.log(a);
let a = 2;
}
//会报错, a is not defined, 这时作用域里a使用了let定义, 导致作用域内形成死去, 不会去找全局变量的a.

因此使用let无法重复定义变量.

let a = 2;
let a = 1;
console.log(a);
//报错, Identifier 'a' has already been declared

ES6 let 不存在变量声明提升

在es6之前, 如果像这样定义一个a变量不会报错的, 但如果使用let定义, 则会报错

console.log(a);
var a = 1;
//不会报错, 输出undefined;

console.log(b);
let b = 2;
//报错, b is not defined

const

特点一: 一旦声明常量的值就不能更改

const PI = 3.14;
PI = 3.14;
//报错, Assignment to constant variable.

特点二: 声明一个常量必须马上初始化

const PI;
PI = 3.14
//报错,  Missing initializer in const declaration

特点三: let 和 const 一样不能重复声明

const message = 'hello';
let age = 20;
const message = 'world';
let age = 10;
//报错

额外补充 : const指向变量的地址, 只要变量名所引用的地址不变就不会报错, 例如:

const a = {name: [1,2,3]};
a.name[0] = 4;
//不会报错

const foo = {};
foo.prop = 123;
console.log(foo.prop);
//不会报错

foo = {};
//报错