JavaScript 特定函数提升答案

【问题标题】：JavaScript specific function hoistingJavaScript 特定函数提升
【发布时间】：2019-11-20 14:04:48
【问题描述】：

我想具体了解一下吊起时首先出现的功能。它们是否与开始时一样：

var z;
function b(){}
function a(){}

会变成

function b(){}
function a(){}
var z;

或者它还有其他作用吗？这对调用其他函数的函数有何影响？有没有

var z;
function b(){a();}
function a(){}

知道成为

function a(){}
function b(){a();}
var z;

还是我错过了什么？

【问题讨论】：

有什么不同吗？
您有什么具体问题吗？函数声明语句实际上并没有做任何事情；函数名绑定到词法范围内的函数。因此，解释的顺序是什么并不重要。
我更愿意确切地知道编译器是如何处理我的代码的，特别是如果函数顺序在我不希望它发生变化时可能会在以后引起问题。我喜欢编写尽可能接近运行的代码，使调试更容易
我没有任何具体问题，我只是想了解它在做什么
函数声明的顺序根本不重要。感谢提升本身，所有函数都将在任何代码能够调用它们之前被声明。因此，它不会改变您编写的代码的运行方式，因此不会在调试时对您有任何帮助。

标签： javascript hoisting

【解决方案1】：

如MDN中所述：

JavaScript 将函数声明放入其中的优点之一在它执行任何代码段之前的内存是它允许你在代码中声明函数之前使用它。

所以.. 是的 - 您的函数在任何实际函数调用之前加载到内存中。例如：

function b() { console.log('b'); a() }
b()
function a() { console.log('a')}

将正确调用函数 a，尽管 b 函数调用（在第 2 行）被放置在函数声明 a

之前

附带说明.. 请尽量避免在变量中出现这种行为，因为您最终可能会将变量附加到全局范围或冒“范围冒泡”的风险（使用此link 了解更多详细信息）

【讨论】：

【解决方案2】：

吊装前

var z;
function b(){a();}
function a(){}

吊装后

reference to b;
reference to a;
z = undefined;

进入b函数后，你就可以毫无问题地执行a函数了。

JS 引擎在执行任何代码时执行以下两个步骤：

创建阶段：

JS 引擎解析 - 运行您的代码 & 识别变量 & 代码创建的函数（将在执行阶段使用）

为变量和函数设置内存空间 - “提升”

Hoisting - 在你的代码被执行之前，JS 引擎会留出内存空间对于代码内部使用的 Var & Func。这些变量和函数包含被执行的任何函数的执行上下文。 JS 中的所有变量最初都设置为 undefined。

执行阶段：很容易理解，

当代码被逐行执行时（由 JS 解释器），它可以访问在执行上下文中定义的变量

变量作业在这个阶段完成

只要有函数调用，就会创建一个新的执行上下文

链接到帖子 - https://stackoverflow.com/a/44748585/7291317。

【讨论】：

【解决方案3】：

函数和变量声明都被提升，但函数声明在变量之前被提升。

所以你的代码：

var z;
function b(){}
function a(){}

被JS引擎编译后会变成：

function b(){}
function a(){}
var z;

现在的问题是下面的代码可以正常工作吗？

var z;
function b(){a();}
function a(){}

在上面的代码中，function a 在声明之前在function b 中被调用。 JS 引擎分两个阶段工作，第一个是 编译阶段，在这个阶段会发生所有的提升，第二个是 执行阶段，在这个阶段会发生执行。

所以当你调用function a（最终会发生在执行阶段）会发生在编译阶段function a的声明之后。

例如。

当你写作时：

console.log(a); // undefined cause var a; is declared first 

var a = 10;

上面的代码会被JS引擎解释为，

var a ;

console.log(a); // undefined;

a = 10;

更多关于Hoisting.的信息

【讨论】：