JavaScript的声明提升

forceddd

1.何为声明提升?

在JavaScript中,当出现var声明的变量或者function声明的函数时,会将该声明提到当前作用域的前面执行,这便是声明提升。值得注意的是,只是提升了声明操作,赋值还是在原来的位置进行。
声明提升包括变量声明提升和函数声明提升。

变量声明提升

先来看一看变量的声明提升。
比如下面的代码:

        console.log(a);//undefined 不是not defined
        var a=2;
        console.log(a);//2

这段代码中出现了var 声明的变量,出现了变量声明提升现象,相当于

        var a;//声明被提到了最上方 赋值操作位置不变
        console.log(a);//undefined 此时尚未执行到赋值语句
        a=2;
        console.log(a);//2

函数声明提升

我们应该经常会有写过这种代码

    foo();
    function foo() {
            console.log("foo");
        }

函数foo的声明是写在执行之后的,但是脚本不会抛出异常,这便是函数的声明提升。上面的代码在编译时,等价于

    function foo() {
            console.log("foo");
        }
    //函数的声明被提到了前面
    foo();

在函数声明提升中,要注意只有函数的声明会被提升,函数表达式不会被提升。比如:

    foo1();//抛出异常 not a function
    var foo1=function () {
            console.log("foo1");
        }

这个问题的本质在于,foo1是一个var声明的变量,他出现了变量提升,但是对于他的赋值没有提升。以上代码等价于:

        var foo1;
        foo1();//此处foo1还没有被赋值 not a function
        foo1=function () {
            console.log("foo1");
        }

2.声明提升的注意事项

1.var与function同时进行提升之后,var的声明会被提升到到function的声明之前。也因此,如果同一个作用域内,声明的函数名与声明的变量名相同,并且变量在声明时,没有进行赋值操作,变量会被函数覆盖。

        var a;
        function a() { 
        //代码块
        }

如果变量声明时进行了赋值,变量值会覆盖函数,

        var a=10;
        function a() {

        }
        console.log(a);//10

相当于:

        var a;
        function a() {

        }
        a=10;
        console.log(a);

2.变量的重复声明时没有用的,因为都会被提升到最前面执行,函数的重复声明会使声明在前的函数被覆盖。

阅读 466

一名前端爱好者

24 声望
0 粉丝
0 条评论

一名前端爱好者

24 声望
0 粉丝
宣传栏