JavaScript 变量提升解释

Question

我看到了以下关于 javascript 中的变量提升的文章。文章总结了以下三点。

1. All declarations, both functions and variables, are hoisted to the top of the containing scope, before any part of your code is executed.
2. Functions are hoisted first, and then variables.
3. Function declarations have priority over variable declarations, but not over variable assignments.

Site Point

var showState = function() {
  console.log("Idle");
};

function showState() {
  console.log("Ready");
} 

showState(); 

我知道代码被javascript引擎解释为

function showState() { // moved to the top (function declaration)
    console.log("Ready");
}

var showState; // moved to the top (variable declaration)
showState = function() { // left in place (variable assignment)
    console.log("Idle");
};

showState();

但是，我无法理解摘要中第三点的含义。谁能解释第三点？第三点是什么意思？

根据第三点的解释，下面的sn -p应该返回8，函数bar()。但它说未定义，函数 bar()。

console.log(foo);
console.log(bar);
var foo = 8;
function bar() {
    console.log("bar");
}

Answer 1

来自您链接到的文章：

在上面的代码中，我们看到函数声明采用 优先于变量声明。在下一个例子中 我们会看到，当我们有函数声明与变量时 分配，最后一个优先。

var showState = function() {
  console.log("Idle");
};

function showState() {
  console.log("Ready");
} 

showState();            // output: Idle

函数声明做了两件事：

1. 它声明了一个与函数同名的变量
2. 它将函数分配给该变量

这两个都被提升了，而不仅仅是变量声明。 （这与带有关联赋值的 var 语句不同，其中只有声明被提升）。

这意味着尽管= function() { 代码在前，但later 函数声明仍然首先运行，因此= function() { 可以覆盖它。

Answer 2

你的最后一个例子被解释为

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

console.log(foo); // here 'foo' is undefined
console.log(bar); // bar is of type function
foo = 8;

Answer 3

基本上 - 假设我们有，没有特定的顺序

function hello(){};
var sup;
var yo = 4;

通过变量提升，订单将变为

    var yo = 4;
    function hello(){};
    var sup;

因为 var 赋值优先于函数，函数优先于函数声明。