导语：js代码解析需知

首先js引擎在读取js代码时会进行两个步骤：

第一个步骤是解释，所谓解释就是会先通篇扫描所有的Js代码，然后把所有声明提升到顶端。 第二个步骤是执行， 所谓执行就是操作一类的。

好吧，举几个好吃的栗子：

例子1：

console.log(a); //输出结果 undefinedvar a = 10;//  以上代码输出 undefined//  原因： 变量提升（ 把变量声明提升到当前执行环境的最顶端）//  上段代码相当于：var a;console.log(a); //由于未赋值 所以输出undefined a = 10;

例2：

foo();function foo() {    console.log();}//  结果输出： aaa // 原理：函数声明提升 （函数声明提升直接把整个函数提到执行环境的最顶端）​// 相当于：function foo() {    console.log();}​foo();//  变量提升只提升函数名 而函数提升会提升整个函数题 注意：函数提升在变量提升上面。​

例3：

foo();var foo = function () {    console.log();}​// 运行结果是： foo is not a function​// 原因： 还是进行了变量提升 // 相当于：var foo;console.log(foo); //undefinedfoo(); //foo is not a functionfoo = function () {    console.log();}//  上面代码输出undefined 是因为变量提升后并没有赋值因此输出undefined​// 输出foo is not a function 原因是：js解析遇到 foo()时会默认当做函数来解析​

例4：

console.log(foo);var foo = 10;console.log(foo);​function foo() {    console.log(10);}console.log(foo);// 输出结果：​function () { //67行输出    console.log(10);}10 //69行输出10 //72行输出///  原理： // 相当于：function foo() {    console.log(10);}var foo;console.log(foo);foo = 10;console.log(foo);console.log(foo);// 注意： 函数提升在变量提升上面，第一个console.log(foo);为什么会输出函数题呢，原因在于 var foo; 并未有赋值只是声明，因此他会调用上面的值// 例如:var b = 10;b = 10;console.log(b); //10 输出上一个值不会输出undefined// 但是更改后：var b = 10;b = 20;console.log(b); //20 输出20不是上一个值

总结一下：

关于变量提升，一定要注意细心思考一下，还有就是要牢记，函数提升在变量提升之上；希望刚入行的小伙伴看到后能有所领悟。

本文内容由小芦整理编辑！