js中的声明提升

今天来说说js中的声明提升
我们来看看 var 声明的「创建、初始化和赋值」过程

假设有如下代码：

function fn(){ var x = 1 var y = 2 } fn() 在执行 fn 时，会有以下过程（不完全）：

进入 fn，为 fn 创建一个环境。 找到 fn 中所有用 var 声明的变量，在这个环境中「创建」这些变量（即 x 和 y）。 将这些变量「初始化」为 undefined。 开始执行代码 x = 1 将 x 变量「赋值」为 1 y = 2 将 y 变量「赋值」为 2 也就是说 var 声明会在代码执行之前就将「创建变量，并将其初始化为 undefined」。

这就解释了为什么在 var x = 1 之前 console.log(x) 会得到 undefined。

接下来来看 function 声明的「创建、初始化和赋值」过程

假设代码如下：

fn2()

function fn2(){ console.log(2) } JS 引擎会有一下过程：

找到所有用 function 声明的变量，在环境中「创建」这些变量。 将这些变量「初始化」并「赋值」为 function(){ console.log(2) }。 开始执行代码 fn2() 也就是说 function 声明会在代码执行之前就「创建、初始化并赋值」。

接下来看 let 声明的「创建、初始化和赋值」过程

假设代码如下：

{ let x = 1 x = 2 } 我们只看 {} 里面的过程：

找到所有用 let 声明的变量，在环境中「创建」这些变量 开始执行代码（注意现在还没有初始化） 执行 x = 1，将 x 「初始化」为 1（这并不是一次赋值，如果代码是 let x，就将 x 初始化为 undefined） 执行 x = 2，对 x 进行「赋值」 这就解释了为什么在 let x 之前使用 x 会报错：

let x = 'global' { console.log(x) // Uncaught ReferenceError: x is not defined let x = 1 } 原因有两个

console.log(x) 中的 x 指的是下面的 x，而不是全局的 x 执行 log 时 x 还没「初始化」，所以不能使用（也就是所谓的暂时死区） 看到这里，你应该明白了 let 到底有没有提升：

let 的「创建」过程被提升了，但是初始化没有提升。 var 的「创建」和「初始化」都被提升了。 function 的「创建」「初始化」和「赋值」都被提升了。

转载于:https://juejin.im/post/5bf0ddd351882545f7300a6a