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

let

块级作用域

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

例:

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

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

1
2
3
4
5
6
7
8
var oDiv = document.getElementsByTagName('div');
for(var i = 0; i < 10; i++){
(function(j){
oDiv[j].onlick = function(){
alert(j);
}
})(i)
}

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

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

块级作用域特点

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

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

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

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

ES6 let 不存在变量声明提升

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

1
2
3
4
5
6
7
console.log(a);
var a = 1;
//不会报错, 输出undefined;
console.log(b);
let b = 2;
//报错, b is not defined


const

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

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

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

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

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

1
2
3
4
5
const message = 'hello';
let age = 20;
const message = 'world';
let age = 10;
//报错

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

1
2
3
4
5
6
7
8
9
10
11
const a = {name: [1,2,3]};
a.name[0] = 4;
//不会报错
const foo = {};
foo.prop = 123;
console.log(foo.prop);
//不会报错
foo = {};
//报错
越来越多的平台(微信公众平台,新浪微博,简书,百度打赏等)支持打赏功能,付费阅读时代越来越近,特此增加了打赏功能,支持微信打赏和支付宝打赏。坚持原创技术分享,您的支持将鼓励我继续创作!