A-A+

ES6 中的let与const

2017年04月15日 HTML/CSS, JavaScript 暂无评论

基础

变量的创建方式取决于你如何声明他。
var声明的变量,会被视为在函数级作用域内顶部的位置(不在函数内部则全局)

function getValue(condition) {
//var  value;
    if (condition) {
        var value = "blue";//value="blue";
        // other code
        return value;
    } else {
        // value exists here with a value of undefined
        return null;
    }
    // value exists here with a value of undefined
}

块作用域

类似于C语言的工作机制。
let 声明不会将变量提升至当前作用域的顶部。禁止再次声明。

var count = 30;
// 不会抛出错误
if (condition) {
    let count = 40; //let的声明是在if语句中。和var非同一级
    // 其它代码
}

const

Constant adj.
不变的;恒定的;经常的
n. [数] 常数;恒量

// 合法的声明
const maxItems = 30;
// 语法错误:未初始化
const name;

不能被再次赋值。
const 声明只是阻止变量和值的再次绑定而不是值本身的修改。这意味着 const 不能限制对于值的类型为对象的变量的修改。

const person = {
    name: "Nicholas"
};
// 正常
person.name = "Greg";
// 抛出错误
person = {
    name: "Greg"
};

const有一个很好的应用场景,就是当我们引用第三方库的时声明的变量,用const来声明可以避免未来不小心重命名而导致出现bug

暂存性死区(The Temporal Dead Zone)

let 或 const 声明的变量在声明之前不能被访问,typeof 也不行。

当 JavaScript 引擎在作用域中寻找变量声明时,会将变量提升到函数/全局作用域的顶部(var)或是放入 TDZ(let 和const)内部。任何试图访问 TDZ 内部变量的行为都会以抛出运行时(runtime)错误而告终。当执行流达到变量声明的位置时,变量才会被移出 TDZ ,代表它们可以被安全使用。
// TODO

var funcs = [];
for (let i = 0; i < 10; i++) {//const不可
    funcs.push(function() {
        console.log(i);
    });
}
funcs.forEach(function(func) {
    func();    // 输出 0,1,2 … 9
})

let 声明使得每次迭代都会创建一个变量 i,所以循环内部创建的函数会获得各自的变量 i 的拷贝。每份拷贝都会在每次迭代的开始被创建并被赋值。
只有在循环过程中不更改在初始化语句中声明的变量的条件下,才能在里面使用 const 声明。
当使用 for-in 或 for-of 循环时,const 声明的变量的表现和 let 完全一致。
在全局作用域内使用 let 或 const,那么绑定就会发生在全局作用域内,但是不会向全局对象内部添加任何属性。

// 在浏览器中运行
let RegExp = "Hello!";
console.log(RegExp);                    // "Hello!"
console.log(window.RegExp === RegExp);  // false

let可简单地替换var
const 是声明变量的默认方式,仅当你明确哪些变量之后需要修改的情况下再用 let 声明那些变量。

问题

为什么会有var、let。他们两个有什么异同点,有哪些适用场景?var是否需要全部被替换?
最后编辑于2017年8月24日06:46

标签:

给我留言

Copyright © 花未全开月未圆 保留所有权利.   Theme  Ality 海外

用户登录