「前端骚操作」var，let与const的恩怨情仇

var，let与const的纠葛爱恨

title img

附注源于《深入细致认知 ES6》的书，有更多浓厚兴趣的提议看一看。

四角亲密关系只不过很明晰

js：喵蛋，我谁敢说表达式新闻稿比我“杰出”的？

php：当今世界“第三”的我则表示，不肯。

java：当今世界最“牛”的我则表示，不肯。

python：当今世界最“简单”的我则表示，不肯。

c：傻逼……

var

遵行一点儿：var 新闻稿的表达式总有一天新闻稿在现阶段所处表达式的促进作用皮先卡，非表达式促进作用皮先卡新闻稿还是被当作新闻稿在所处表达式内，如下表所示伪标识符：

function() { var a = 1 if(any) { var b = 1 console.log(a, b,) // 1, 1 } else { console.log(a, b) // 1, undefined，特别注意并非not defined } console.log(b) // undefined }

当中 var b = 1 被降解为：var b; b = 1，而 var b 部份被提高（hoisting，跟我读：唉听？）到 function 里头了，知道？如下表所示：

function() { var a var b a = 1 if(any) { b = 1 console.log(a, b,) // 1, 1 } else { console.log(a, b) // 1, undefined，特别注意并非not defined } console.log(b) // undefined }

与 window 的亲密关系

在浏览器环境下，全局默认有个 window 对象，因为 var 的 hoisting 存在，会使得 var 个东西变成 window 的，这并非坏事，很多人已经习惯这么干了，比如：

var test = 1 window.test // 1 if(1) { var test1 = 1 } window.test1 // 1var RegExp = 1 window.RegExp // 1

大哥，RegExp 是很重要的对象好吗？

let

首先，let 就锁促进作用域了，跟 var 不同，不会 hoisting（读一遍），而且是根据标识符块，而并非表达式促进作用于，也就是说，if，for 等等都会锁促进作用域，如下表所示伪标识符：

function() { let a = 1 if(any) { let b = 1 console.log(a, b,) // 1, 1 } else { console.log(a, b) // 1, not defined，只不过这里是报错…… } console.log(b) // not defined，只不过这里是报错…… }

其次，let 不允许同促进作用皮先卡重复新闻稿，特别注意，同促进作用域，伪标识符：

function() { let a = 1 let a = 2 // 报错 if(any) { let a = 3 // 没错，此a非彼a了，现阶段标识符块内用到的都是这个a } }

暂时性死区

temporal dead zone，TDZ

这个名字非常非常的头（shuai）疼（qi），看这个标识符：

if(1) { console.log(typeof a) // undefined，hoisting，ok？ var a = 1 } if(1) { console.log(typeof a) // 暂时性死区 let a = 1 } console.log(typeof a) // undefined if(1) { let a = 1 }

头大不？只不过这个头（shuai）疼（qi）的名词解释的反而挺到位的。

var 不解释了，先解释第三个，就是常规的使用 typeof 检测表达式属性，如果表达式未申明，返回undefined，这是正常的；但是在 let 和 const（没错，const一样）所处促进作用皮先卡，因为 let 和 const 的存在，导致其申明的表达式被锁死，在申明前被调用的话，呵呵，不唉，就算你是 typeof 大哥也没用，报错。

特别注意，说的是被 let 和 const 申明的才会被锁死，没被绑定的是常规处理，如下表所示：

if(1) { console.log(typeof jhdskfkjfhdkj) // undefined console.log(typeof a) // 暂时性死区 let a = 1 }

与 window 的亲密关系

没亲密关系。

let RegExp = 1 window.RegExp // ƒ RegExp() { [native code] } RegExp // 1

const

constant（跟我读：康斯顿~），就是不变的量，很多人容易忘记初始化，然后报错了再来添加初始值，这里脑子稍微过一下就可以记住：

假如不赋值能成功（说了假如），那就是 undefined，你没事创建个 undefined 来展示标识符有多l ow 么？然后你又后面修改，但是本身人家就不能修改，所以一定需要初始化赋值，这样逻辑就通了……

恩，对了，他的促进作用域跟 let 一样一样的。没错，重复新闻稿也不行。

之前说过，const 比较坑的就是，如果值是对象，对象的属性却是可以修改的……伪标识符：

const a = { b: 1 } a = {} // 报错 a.b = 2 // 没错

暂时性死区