浅谈变量提升

变量提升是面试中非常常见的一个问题

比如 var 和 let 的区别是什么？

答案之一就有 let 不会变量提升

 

1.概念

最基础的概念大家都知道

console.log(a);
var a = 1;

// 输出 undefined

 

在代码中 使用 var 来声明变量的时候，会提到当前作用域的顶端，而赋值操作在原处不变

上面的两行代码相当于

var a;
console.log(a);
a = 1;

 var a声明向上提升，a=1赋值留在原处

 

2.多个script的情况

<script>
console.log(a)
</script>
<script>
var a = 1;
</script>
// 控制台报错

 这样控制台就报错了

ReferenceError: a is not defined

变量提升不能跨script

 

3.其它情况

首先看不用var直接赋值

console.log(a);  //ReferenceError: a is not defined
a = 1;

 同样报错，因为使用 var才会变量提升（我所知）

 

在 if  中

  console.log(a) // undifined
  if(false){
    var a = 1;
  }

 尽管 if 不通过，还是提升了

 

4.函数提升

变量声明会提示，函数声明也会

    console.log(foo);
    var foo=10;
    console.log(foo);
    function foo(){

    }
    console.log(foo);
　　//输出 function a,10,10

 函数会优先于变量  先提升

上面代码相当于

function a(){
}
var a;
console.log(a);
a=10;
console.log(a);

console.log(a);

 

当时，如果用函数表达式，那就只提升了这个 a变量，符合之前的变量提升的逻辑

    a();
    var a = function () {
      console.log(1)
    }
//TypeError: a is not a function

 

补充

暂存性死区

当当前作用域与父级作用域都存在同一变量名的变量时，不能在访问父级的同名变量

var a = 1;
function test(){
　　console.log(a)  //Cannot access 'a' before initialization

　　let a = 1
}
test();