深入理解js的变量提升和函数提升

一、变量提升

通俗的来说，变量提升就是：在变量的作用域内，不管变量在何处声明，都会被提升到作用域的顶部，但是变量初始化的顺序不变。（注意，变量提升只将声明部分提升，赋值部分不改变位置，具体可以看例子理解）

变量提升即将变量声明提升到它所在作用域的最开始的部分。

例：

function test() {
    a=1;
    b=2;
    c=3
    var a,b,c;
    console.log(a);
    console.log(b);
    console.log(c);
    }

　　
这样一段代码，a , b, c三个变量是先赋值后声明，因为，按照变量提升的原则，在代码执行前，js编译器会将代码改成这样：

function test() {
    var a,b,c;
    a=1;
    b=2;
    c=3
    console.log(a);
    console.log(b);
    console.log(c);
    }

再如：

    var value="nihao";
    function test() {
    console.log(value);
    var value="byebye";
    }
    test();

这段代码输出的是undefined，你可能会认为为什么没打印全局变量value？那是因为，根据变量提升的原则，js会将这段代码改成以下代码：

var value="nihao";     
function test() {
var value；     
console.log(value);     
value="byebye";     
}

js会将作用域中的变量的声明放到作用域最顶部，这样打印value时，就近查找找到了value，所以不会再找全局的变量了，但此时value没有赋值，所以打印了undefined。

二、函数提升

　　js中创建函数有两种方式：函数声明式和函数字面量式。只有函数声明才存在函数提升！如:

console.log(f1); // function f1() {}   
console.log(f2); // undefined  
function f1() {}
var f2 = function() {}

　　只所以会有以上的打印结果，是由于js中的函数提升导致代码实际上是按照以下来执行的：

function f1() {} // 函数提升，整个代码块提升到文件的最开始<br>　　　　　console.log(f1);   
console.log(f2);   
var f2 = function() {}

结语：基本上就是这样，要熟练掌握的话可以多做些练习，test:

console.log(f1()); 
console.log(f2);   
function f1() {console.log('aa')}
var f2 = function() {}

(function() {
　　console.log(a);
　　a = 'aaa';
　　var a = 'bbb';
　　console.log(a);
})();