首页手记 ES6的"临时性死区&quo...

ES6的"临时性死区"和“变量提升”

标签：

JavaScript

1.临时性死区

在讲到临时性死区这个概念的时候，我们先来做一个小题目：

<script>
    console.log(color);
    var color = 'yellow';
</script>

请问图上的代码打印出来后结果是什么？

A.referenceError B.undefined C.yellow
正确答案是B哦，有没有答对呢~这是为什么呢？原因就是在javascript中存在变量提升这个概念，在javascript中，functions中variables会被提升。变量提升是javascript将声明移至作用域scope（全局域或者当前函数作用域）顶部的行为。所以，以上代码实际运行当中其实是

<script>
    var color；
    console.log(color);
    color = 'yellow';
</script>

由于之前已经声明了变量，所以不会报referenceError ，同时还没来得及给color赋值yellow，所以最后的结果是undefined。
当然啦，如果把var换成let和const会是什么样的结果的？结果就是出现referenceError报错，其实呢在let中也存在变量提升这个概念的，但是在let和const中还存在一个叫做 “临时性死区” 的概念。在这个作用域的开始直到变量的声明之前，这个变量都是处在 “临时性死区” 当中的，这个时候引用他的话会报referenceError的错误，其实这个特征可以帮助我们养成在变量未声明之前不要使用它的好习惯。
在ES6中选择困难的我应该怎样使用var、let和const来声明我的变量呢~目前我采用的是默认使用const，需要重新绑定或者更新的时候就使用let，在ES6中尽量不使用var。如果不想你的变量被修改的话使用const简洁明了，如果你会重新更新这个变量的值那么就使用let，而使用var可能会产生一些重复声明，以及在定义之前使用它不太容易找到的错误，所以尽量使用const和let。