1、函數聲明與函數表達式
在ECMAScript中，創建函數的最常用的兩個方法是函數表達式和函數聲明，兩者期間的區別是有點暈，因為ECMA規范只明確了一點：函數聲明必須帶有標示符（Identifier）（就是大家常說的函數名稱），而函數表達式則可以省略這個標示符：
函數聲明：function 函數名稱 (參數：可選){ 函數體 }
函數表達式：function 函數名稱（可選）(參數：可選){ 函數體 }
所以，可以看出，如果不聲明函數名稱，它肯定是表達式，可如果聲明了函數名稱的話，如何判斷是函數聲明還是函數表達式呢？ECMAScript是通過上下文來區分的，如果function foo(){}是作為賦值表達式的一部分的話，那它就是一個函數表達式，如果function foo(){}被包含在一個函數體內，或者位於程序的最頂部的話，那它就是一個函數聲明。
function foo(){} // 聲明，因為它是程序的一部分
var bar = function foo(){}; // 表達式，因為它是賦值表達式的一部分
new function bar(){}; // 表達式，因為它是new表達式
(function(){
function bar(){} // 聲明，因為它是函數體的一部分
})();
表達式和聲明存在著十分微妙的差別，首先，函數聲明會在任何表達式被解析和求值之前先被解析和求值，即使你的聲明在代碼的最後一行，它也會在同作用域內第一個表達式之前被解析/求值，參考如下例子，函數fn是在alert之後聲明的，但是在alert執行的時候，fn已經有定義了：
alert(fn());
function fn() {
return 'Hello world!';
}
另外，還有一點需要提醒一下，函數聲明在條件語句內雖然可以用，但是沒有被標准化，也就是說不同的環境可能有不同的執行結果，所以這樣情況下，最好使用函數表達式： 因為在條件語句中沒有塊級作用域這個概念
// 千萬別這樣做！
// 因為有的浏覽器會返回first的這個function，而有的浏覽器返回的卻是第二個
if (true) {
function foo() {
return 'first';
}
}
else {
function foo() {
return 'second';
}
}
foo();
// 相反，這樣情況，我們要用函數表達式
var foo;
if (true) {
foo = function() {
return 'first';
};
}
else {
foo = function() {
return 'second';
};
}
foo();
函數聲明的實際規則如下：
函數聲明只能出現在程序或函數體內。從句法上講，它們 不能出現在Block（塊）（{ … }）中，例如不能出現在 if、while 或 for 語句中。因為 Block（塊） 中只能包含Statement語句， 而不能包含函數聲明這樣的源元素。另一方面，仔細看一看規則也會發現，唯一可能讓表達式出現在Block（塊）中情形，就是讓它作為表達式語句的一部分。但是，規范明確規定了表達式語句不能以關鍵字function開頭。而這實際上就是說，函數表達式同樣也不能出現在Statement語句或Block（塊）中（因為Block（塊）就是由Statement語句構成的）。
2、命名函數表達式
提到命名函數表達式，理所當然，就是它得有名字，前面的例子var bar = function foo(){};就是一個有效的命名函數表達式，但有一點需要記住：這個名字只在新定義的函數作用域內有效，因為規范規定了標示符不能在外圍的作用域內有效：
var f = function foo(){
return typeof foo; // function --->foo是在內部作用域內有效
};
// foo在外部用於是不可見的
typeof foo; // "undefined"
f(); // "function"
既然，這麼要求，那命名函數表達式到底有啥用啊？為啥要取名？
正如我們開頭所說：給它一個名字就是可以讓調試過程更方便，因為在調試的時候，如果在調用棧中的每個項都有自己的名字來描述，那麼調試過程就太爽了，感受不一樣嘛。
tips:這裡提出一個小問題：在ES3中，命名函數表達式的作用域對象也繼承了 Object.prototype 的屬性。這意味著僅僅是給函數表達式命名也會將 Object.prototype 中的所有屬性引入到作用域中。結果可能會出人意料。
var constructor = function(){return null;}
var f = function f(){
return construcor();
}
f(); //{in ES3 環境}
該程序看起來會產生 null, 但其實會產生一個新的對象。因為命名函數表達式在其作用域內繼承了 Object.prototype.constructor（即 Object 的構造函數）。就像 with 語句一樣，這個作用域會因 Object.prototype 的動態改變而受到影響。幸運的是，ES5 修正了這個錯誤。
這種行為的一個合理的解決辦法是創建一個與函數表達式同名的局部變量並賦值為 null。即使在沒有錯誤地提升函數表達式聲明的環境中，使用 var 重聲明變量能確保仍然會綁定變量 g。設置變量 g 為 null 能確保重復的函數可以被垃圾回收。
var f = function g(){
return 17;
}
var g =null;
3、調試器（調用棧）中的命名函數表達式
剛才說了，命名函數表達式的真正用處是調試，那到底怎麼用呢？如果一個函數有名字，那調試器在調試的時候會將它的名字顯示在調用的棧上。有些調試器（Firebug）有時候還會為你們函數取名並顯示，讓他們和那些應用該函數的便利具有相同的角色，可是通常情況下，這些調試器只安裝簡單的規則來取名，所以說沒有太大價值，我們來看一個例子：不用命名函數表達式
function foo(){
return bar();
}
function bar(){
return baz();
}
function baz(){
debugger;
}
foo();
// 這裡我們使用了3個帶名字的函數聲明
// 所以當調試器走到debugger語句的時候，Firebug的調用棧上看起來非常清晰明了
// 因為很明白地顯示了名稱
baz
bar
foo
expr_test.html()
通過查看調用棧的信息，我們可以很明了地知道foo調用了bar, bar又調用了baz（而foo本身有在expr_test.html文檔的全局作用域內被調用），不過，還有一個比較爽地方，就是剛才說的Firebug為匿名表達式取名的功能：
function foo(){
return bar();
}
var bar = function(){
return baz();
}
function baz(){
debugger;
}
foo();
// Call stack
baz
bar() //看到了麼？
foo
expr_test.html()
然後，當函數表達式稍微復雜一些的時候，調試器就不那麼聰明了，我們只能在調用棧中看到問號：
function foo(){
return bar();
}
var bar = (function(){
if (window.addEventListener) {
return function(){
return baz();
};
}
else if (window.attachEvent) {
return function() {
return baz();
};
}
})();
function baz(){
debugger;
}
foo();
// Call stack
baz
(?)() // 這裡可是問號哦，顯示為匿名函數(anonymous function)
foo
expr_test.html()
另外，當把函數賦值給多個變量的時候，也會出現令人郁悶的問題：
function foo(){
return baz();
}
var bar = function(){
debugger;
};
var baz = bar;
bar = function() {
alert('spoofed');
};
foo();
// Call stack:
bar()
foo
expr_test.html()
這時候，調用棧顯示的是foo調用了bar，但實際上並非如此，之所以有這種問題，是因為baz和另外一個包含alert(‘spoofed')的函數做了引用交換所導致的。
歸根結底，只有給函數表達式取個名字，才是最委托的辦法，也就是使用命名函數表達式。我們來使用帶名字的表達式來重寫上面的例子（注意立即調用的表達式塊裡返回的2個函數的名字都是bar）：
function foo(){
return bar();
}
var bar = (function(){
if (window.addEventListener) {
return function bar(){
return baz();
};
}
else if (window.attachEvent) {
return function bar() {
return baz();
};
}
})();
function baz(){
debugger;
}
foo();
// 又再次看到了清晰的調用棧信息了耶!
baz
bar
foo
expr_test.html()
好的，整個文章結束，大家對javascript的認識又近了一步，希望大家越來越喜歡小編為大家整理的文章，繼續關注跟我學習javascript的一系列文章。