JS预编译的底层逻辑

序言

js中先进行代码的编译再会进行执行，JavaScript中的"var"变量提升和预编译是紧密相关的概念，它们在理解JavaScript中变量声明和作用域的工作方式时非常重要。为了便于后续理解作用域及作用域链，先来整理一下预编译部分的内容

变量提升

关于变量提升的内容：

• var声明的变量会进行变量提升；
• 函数声明function也会提升，且多个同名函数下后面声明的函数会覆盖前面的函数声明；
• 函数声明提升优先于变量提升：函数声明的优先级最高，会被提升到当前作用域最顶端，如：

function hoistFunction() {
    foo(); // 2

    var foo = function() {
        console.log(1);
    };

    foo(); // 1

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

    foo(); // 1
}
hoistFunction();

编译后：

function hoistFunction() {
  var foo;
  function foo() {
    console.log(2);
  }
  foo();//2
  foo = function () {
    console.log(1);
  };
  foo();//1
  foo();//1    
}

预编译阶段，js引擎会扫描代码，发现所有的变量声明与函数声明，并将它们提升到适当的作用域。

调用栈