关于提升的二次思考

函数提升与变量提升

Posted by EWL on December 10, 2019

提升

所谓提升就是在执行代码,创建并进入上下文时在变量对象中收集添加当前作用域中所有的变量声明以及函数声明,在这样的过程中,函数声明的优先级会比变量声明的优先级更高,这究竟是什么意思呢?这里我用伪代码解释一下:

console.log(foo); // foo函数体

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

var foo = 1;

当我们在全局环境去执行上面这段代码时,我们将执行上下文的处理过程分为两个阶段:分析以及执行

分析

当前阶段会收集所有的变量以及函数声明,再次强调是声明,所以不会包含赋值部分,赋值部分是执行阶段才会做的事,这里不能混淆概念。所以当前阶段,全局的变量对象如下:

globalVO = {
    foo: function foo() {
        console.log('foo')
    }
}

可以看到这段代码中,foo除了函数声明之外,还有一个变量声明,但是由于变量声明优先级低于函数声明,所以foo变量不会覆盖掉foo函数,所以分析阶段的foo属性值就是foo函数体。

执行

到了执行阶段,代码会逐行执行。为了更直观地理解提升,我们结合上述分析阶段写出预编译后的代码,如下:

function foo() {
    console.log('foo');
}
var foo; // 不影响上面的函数声明

conosle.log(foo); // 打印出函数体

foo = 1; // 姗姗来迟的赋值

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~split-line~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

关于提升的总结

之前虽然已经写过一个长篇的博客阐述提升,但是总觉得不够深刻,再次拜读了冴羽大佬的博客之后,对于执行上下文的创建以及分析、执行的过程有了更深刻的理解,对于提升的概念也有了更清晰直观的体会,尤其是其中的函数声明和变量声明的优先级,其中着重需要反复理解的就是分析阶段和执行阶段。

好的,本次的回顾到此结束。 bye~