javascript function 声明及编译执行顺序Tips

今天在学习 前端工程师手册 > 关于函数 章节时收获一点点知识，做个记录并分享一下。
我们先从看两段代码，再来分析。
代码1：

    function foo() { return 1; }
    var foo = function() { return 2; }
    foo(); //结果是 2

代码2：

    var foo = function(){ return 2;}
    function foo() { return 1; }
    foo(); //结果是 2

*知识点：在当前作用域下,函数声明会被最先提前被编译执行，如本文：function foo(){}

所以上面代码类似于：

代码1：

    function foo() { return 1; }
    var foo = function() { return 2; }
    foo();
     
    ↓↓ (编译后)
    
    var foo = function() { return 1; }
    foo = function() { return 2; }
    foo(); 

代码2：

    var foo = function() { return 2; }
    function foo() { return 1; }
    foo(); 
     
    ↓↓ (编译后)
    
    var foo = function(){return 1;}//function foo() { return 1; }被提到最前面了
    foo = function(){return 2;}
    foo(); 

---

再来看另一种情况：

    if (true) {
        function foo() { return 1; }
    }
    function foo() { return 2; }
    foo(); //结果 1

我们还是按照上面逻辑进行解读：

    if (true) {
        function foo() { return 1; }
    }
    function foo() { return 2; }
    foo(); 
    
    ↓↓ (编译后)
    
    var foo = function () { return 2; }
    if (true) {
        var foo = function () { return 1; }
    }
    foo(); 

---

可能有人会疑问：为什么function foo () { return 1; } 没有被提前呢？

因为函数声明只能出现在程序或函数体内。从句法上讲，它们 不能出现在Block（块）（{ ... }）中，例如不能出现在 if、while 或for 语句中。因为 Block（块） 中只能包含Statement语句，
而不能包含函数声明这样的源元素。另一方面，仔细看一看规则也会发现，唯一可能让表达式出现在Block（块）中情形，就是让它作为表达式语句的一部分。但是，规范明确规定了表达式语句不能以关键字function开头。而这实际上就是说，函数表达式同样也不能出现在Statement语句或Block（块）中（因为Block（块）就是由Statement语句构成的）。

所以我们代码中的function foo () { return 1; } 是在if中,只能被视为函数表达式，而不是函数声明，不会被提前编译解析。