1. 变量提升
使用var申明变量的时候,不管变量的申明写在哪里,最后都会被提升到顶端去。
因此,我们可以先使用变量,在申明变量,却不会报错,只会输出undefined。
console.log(num) // undefined
var num = 1;
在函数中也是一样的,在函数内部申明的变量会被提升到函数作用域的顶端。
function getNum() {
console.log(num); // undefined
var num = 1;
}
事实上,JS也是有编译阶段的,它和传统语言的区别在于,JS不会早早地把编译工作做完,而是一边编译一边执行。
在这个短暂的编译阶段里,JS 引擎会搜集所有的变量声明,并且提前让声明生效。至于剩下的语句,则需要等到执行阶段、等到执行到具体的某一句的时候才会生效。这就是变量提升背后的机制。
2. 暂时性死区
按理说下面这段代码会正常运行,因为运行到me = 'lee';
的时候me已经申明了,但却报错了。
var me = 'icon';
{
me = 'lee';
let me;
}
这是因为 ES6 中有明确的规定:如果区块中存在 let 和 const 命令,这个区块对这些命令声明的变量,从一开始就形成了封闭作用域。假如我们尝试在声明前去使用这类变量,就会报错,这就是“暂时性死区”。
这时候去掉me = 'lee';
就可以正常运行了。