JavaScript 变量声明提升

Posted destinyruru

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了JavaScript 变量声明提升相关的知识,希望对你有一定的参考价值。

javascript 变量声明提升

一、变量提升的部分只是变量的声明,赋值语句和可执行的代码逻辑还保持在原地不动

二、在基本的语句(或者说代码块)中(比如:if语句、for语句、while语句、switch语句、for...in语句等),不存在变量声明提升

三、函数声明会提升,但是函数表达式的函数体就不会提升

 1  fun();       // hello 
 2     function fun(){
 3       console.log("hello");
 4     }
 5     // --------------
 6     // 提升后
 7 
 8     function fun(){
 9       console.log("hello");
10     }
11 
12     fun();       // hello 

 1  var fun = function(){
 2       console.log("hello");
 3     };
 4 
 5     // --------------
 6     // 提升后
 7 
 8     var fun;
 9 
10     fun();        // 报错,TypeError: fun is not a function
11 
12     fun = function(){
13       console.log("hello");
14     };

四、如果一个变量和函数同名,函数声明优先于变量声明(毕竟函数是 JavaScript 的第一等公民),并且与函数名同名的变量声明将会被忽略

看几个例题:

第一个: 

1 var foo = 1;
2 function bar() {
3     if (!foo) {
4         var foo = 10;
5     }
6     alert(foo); //输出为10
7 }
8 bar();

在if语句中(在javascript不能叫块了吧~~),变量不会被提升,因此!foo判断为true,所以输出就为10啦。                                


 第二个:

1 var a = 1;
2 function b() {
3     a = 10;
4     return;
5     function a() {}
6 }
7 b();
8 alert(a);  // 1

这是一道神奇的题。第一眼认为输出为10。but,根据第四句话,可以得到:

1 function b() {
2   function a() {};//变量提升
3   a = 10;
4   return;
5 }

function a() {} 这种定义方式和 var a = function () {}一样。所以,又可以得到:

1 var a = 1;                 //defines "a" in global scope
2 function b() {  
3    var a = function () {}; //defines "a" in local scope 
4    a = 10;                 //overwrites local variable "a"
5    return;      
6 }       
7 b();       
8 alert(a);                 //alerts global variable "a"

1 var a=1;
2 (function(){
3   a=2;b=2;
4 
5 })();
6 alert(a==b);  //true,作用域的问题,有var和没有var的区别~

以上是关于JavaScript 变量声明提升的主要内容,如果未能解决你的问题,请参考以下文章

JavaScript之变量提升

JavaScript 变量声明提升

javascript变量声明和作用域提升

JS预解析与变量提升

JavaScript变量声明与提升

javascript学习笔记