JS函数声明和函数表达式的区别

Question

JS函数声明和函数表达式的区别

Answer 1

var init = function() { }; 是函数表达式，函数在代码执行的到当前行的时候才被执行，init 才被赋值。

function init() {} 是函数的声明，和 var 一样，会被提前到代码最前面定义。

所以，下面的两个例子：

 

1 2 3 4 5 6 7

foo(); // 在函数声明之后调用 foo，可以正常调用。因为 foo 被提前到最前面定义了。   function foo() {       return true;   }

   

1 2 3 4 5 6 7

foo(); // 在函数表达式之前调用函数，报错。因为这时候还没有 foo 这个变量。   var foo = function() {       return foo;   };

   

ES5 规定，函数只能在顶级作用域和函数作用域中声明，否则是不合法的。例如：

   

1 2 3 4 5 6 7 8 9 10 11

if( true ) {       // 非顶级和函数作用域内定义函数，是错误的，虽然可能浏览器不一定会抛出错误，但是是不规范的。       function foo() {               return true;           }   }

   

 

ES6 引入了块级作用域的概念，这种定义方法就被允许了。在块级作用域里面声明的函数，作用域类似于使用 let 声明的变量，在块级作用域之外没有办法被调用。

例如：

   

1 2 3 4 5 6 7 8 9 10 11

{           function foo() {               return true;           }   }   foo(); // 在函数声明的代码块之外调用函数，会抛出错误。

Answer 2

javascript虽然是解释执行的语言，但也会进行预编译。
if(condition){
function sayHi(){
alert("Hi!");
}
}else{
function sayHi(){
alert("Yo!");
}
}
这种形式，JS引擎在预编译的过程中会注册方法到window对象下，就是window.sayHi。
而不会顾及if else条件，导致重复的sayHi方法被注册，在这种情况下是无效语法。var sayHi;
if(condition){
sayHi=function sayHi(){
alert("Hi!");
};
}else{
sayHi=function sayHi(){
alert("Yo!");
};
}
而下面这种是作为一个 变量（而非函数function），变量是可以被重复赋值的，所以语法不会有问题。