Javascript 提升代码片段答案

【问题标题】：Javascript hoisting code snippetJavascript 提升代码片段
【发布时间】：2018-08-02 11:44:39
【问题描述】：

我正在浏览 JS 提升的代码 sn-ps。其中一个 sn-p 看起来像

var employeeId = 'abc123';

function foo() {
    employeeId();
    return;

    function employeeId() {
        console.log(typeof employeeId);
    }
}
foo();

输出将是：function

我已阅读有关提升的内容，据我了解，所有变量都将被视为在函数顶部声明并在其实际声明/定义行进行初始化。在这种情况下，employeeId 函数标识符将在函数顶部声明为 var employeeId，其值显然是 undefined，因此函数的第一行应该抛出错误。

请告诉我为什么输出是function？

【问题讨论】：

你的问题是什么？

标签： javascript hoisting

【解决方案1】：

var 声明和函数声明都被提升到它们出现的范围的顶部（按此顺序）； vars 获取 undefined 作为它们的值，函数的绑定获取函数作为它们的值。只有在完成之后，函数中的任何分步代码才会执行。

所以您的示例实际上与此相同：

var employeeId;                           // Declaration
function foo() {                          // Declaration
    function employeeId() {               // Declaration (shadows outer `employeeId`)
        console.log(typeof employeeId);
    }

    employeeId();
    return;
}
employeeId = 'abc123';
foo();

【讨论】：

【解决方案2】：

因此函数的第一行应该抛出错误。

否，函数声明与值一起提升（除非在内部块中声明）。

在您的代码中，

var employeeId = 'abc123';

function foo() {
    console.log(employeeId); //will print function body
    return;
      function employeeId() {
        console.log(typeof employeeId);
      }
}

但是如果函数声明是在一个内部块中

var employeeId = 'abc123';

function foo() {
    console.log(employeeId); //will print undefined
    {
      function employeeId() {
        console.log(typeof employeeId);
      }
    }
    return;
}

【讨论】：

【解决方案3】：

这种情况会发生在变量之前的函数声明。

在 JavaScript 中，函数和变量声明被提升到执行上下文的顶部。您需要同时记住这三个规则。

变量和函数声明被提升到执行上下文的顶部。
只有声明被提升，分配没有被提升。赋值发生在声明变量的地方。
函数声明在提升中优先于变量声明。

https://www.codingame.com/playgrounds/7974/understanding-hoisting-in-javascript

【讨论】：