::: align-center
我们所知的"变量提升"
:::
☆经典案例与吐槽
这是每一个js的初学者都接触过的经典案例：
//我们眼中的代码
console.log(a); //输出为undefinedvar
a=1;
先打印，后执行？！
居然没有报错！！Σ(ﾟдﾟ;)
这反直觉的语言究竟是谁设计的!!!("▔□▔)/
☆出现了！是“变量提升”！太好了，我们有救了！
网课的老师或是教科书会告诉我们，这是因为发生了“变量提升”，变量的声明被提高到当前作用域的顶部了。实际的代码执行逻辑如下：
//实际上的代码执行逻辑
var a;
console.log(a);
a=1;
于是我们便骂骂咧咧的接受了这个概念，并在脑海里为它添加上一个名为“特殊情况，特殊处理”的标签。
但是，真的这样就好了么？这与在米共代码里写上一万个if分支有什么区别！这是对主包脑容量可耻的浪费！
☆反叛的号角已然吹响！
这是一个仅靠“变量提升”的思维所解决不了的例子：
//我们眼中的代码
console.log(a);//输出为函数 a()
var a = 1;
function a() { };
按照“变量提升”的思维，代码的执行逻辑如下
//“变量提升”思维下，代码执行的逻辑
var a;console.log(a);//输出为 undefined
a=1;
function a(){};
这是经典的错误，标准的零分！
要解决这个疑问，同学们需要知道究竟是怎样的机制存在，才能知道“变量提升”在这里不管用的原因。
我们所不知的背后机制
☆JaveScript的预编译机制
众所周知，在js代码解释执行前，需要先对代码进行预编译。而js特殊的预编译机制就是导致“变量提升”现象出现的原因。
☆全局预编译
全局预编译的三个步骤
1.创建全局执行上下文 GO对象（Global Object）
2.在全局作用域中寻找声明对象的段落，以键值对{对象名：undefined}的形式添加进GO对象中。
3.在全局作用域中寻找声明函数的段落，以键值对{函数名：函数体}的形式也添加进GO对象中
在完成以上三个步骤之后才开始解释执行js代码，执行时在全局作用域下调用函数与变量时以GO对象中对应的值为准。
示例：
//原来的代码
console.log(a);
console.log(b);
var a;function b(){};
经过预编译后的代码逻辑：
// 事实上的代码逻辑
GO = {
a: undefined,
b: function () { }
}
console.log(GO.a);
console.log(GO.b);
同理对上一部分疑问的解答：
//我们眼中的js代码
console.log(a);
var a = 1;
function a() { };
//实际上的执行逻辑：
GO=
{
a:function (){},
//函数a加入GO时，函数名与对象名相同，所以将属性名a对应的属性值修改了。
}
console.log(GO.a)//输出为函数 a()
于是我们用全局预编译的过程，成功解释了“变量提升”现象发生的原因，以及该说法的局限性。(=・ω・=)
新人报道
☆关于文章
本文仅适用于新手，更多是用来记录与分享up的学习历程，如果对初入js编程您很有所帮助，不放给up点上一个小小的赞啦(°▽°)八(°▽°)♪
☆关于文章可能存在的错误与不严谨处
还望大佬轻喷，如若您在百忙之中指出错误之处，up( ´(00)ˋ )顶礼膜拜
☆本文对js预编译的过程仅作部分阐述，欲知全貌如何，且听下回分解
☆关于up
是学生，前端在学，初学者，初踏入前端界(;¬_¬)
最后 合理利用自己每一分每一秒的时间来学习提升自己，不要再用 “没有时间” 来掩饰自己思想上的懒惰！趁年轻，使劲拼，给未来的自己一个交代！ 这里有内 u 测职位！！https://jsj.top/f/o38ijj
作者：soda_yo
来源：稀土掘金
