js变量提升详解

1．JavaScript代码执行分为两个阶段：

• 预解析阶段：在预解析阶段，js会对以var声明的变量，和function开头的语句块进行提升，将var声明的变量和function 提升至代码的最前面。需要注意的时，function整体提升，var 声明的变量只提升变量声明，并不会在提升的同时进行赋值操作

• 执行阶段

2.举个例子：

alert(a)//undefinedvar a = 1;  

为什么会

输出undefined呢？ 模拟提升的之后的代码 ，上一段代码相当于 var a; //声明一个变量。但是没有初始化Alert(a); a = 1; //初始化为1---------- fun(); //在C语言中，如果不先声明函数，先调用后声明函数会报错，但是js会正常运行function fun(){ alert(“函数被声明了”); } 代码提升后 相当于 function fun(){ alert(“函数被声明了”); } fun();

3.多个函数同名提升规则： 都提升，但是后面的函数会覆盖掉前面函数

func1();  //

输出 我是后声明的函数function func1(){ console.log('我是先声明的函数'); }function func1(){ console.log('我是后声明的函数'); } 模拟提升后的代码function func1(){ console.log('我是先声明的函数'); }function func1(){ console.log('我是后声明的函数'); } func1(); 函数名也是变量，后面的会覆盖前面。

4.变量名和函数名相同提升规则：如果有变量和函数同名，会忽略掉变量，只提升函数

alert(foo); //

输出function foo(){}function foo(){ } var foo = 2; alert(foo); //输出 2----------模拟提升后的代码function foo{}Alert(foo); foo = 2; alert(foo);

5.变量提升分作用域

var num = 123; function test(){
     console.log(num);     var num = 10;
 }
 test(); //

输出undefined； ---------- 模拟变量提升后的代码 var num;function test(){var num console.log(num); //函数内部声明了num，但是没赋值。因为在函数内部声明了num，所以函数会使用它内部声明的num，而不会去全局中找 num = 10; } num = 123;

6.函数表达式不会提升

func();  // func is not a function
 var func = function(){
    alert("1234");
 }


----------


提升后的代码var func;
func();
func = function(){
    alert("1234");
};
 用var声明的变量(包括函数表达式)，只提升声明，不提升赋值操作

7.最后再来个练习

var s1 = “qq”;

foo();

function foo() {
    console.log(s1); 
    var s1 = "tengxunqq";
    console.log(s1);

}

提升后：    var s1;    function foo() {
        var s1;
        console.log(s1); //
        s1= "tengxunqq";
        console.log(s1); //t
    }
     s1 = "qq";
    foo();  //先

输出 undefined 后engxunqq

相关推荐：

JS变量及其作用域知识点介绍

如何对Js变量作用域进行申明？及函数内的作用域实例详解

js变量提升和函数声明预解析实例详解

以上就是js变量提升详解的详细内容，更多请关注Gxl网其它相关文章！