快捷導(dǎo)航

JS兩種定義方式的區(qū)別、內(nèi)部原理

更新時(shí)間：2013年11月21日 15:07:05 投稿：whsnow

方式1 是典型的函數(shù)聲明(Function declarations)。方式2 是函數(shù)表達(dá)式(Function expressions)，未必所有人都知道其區(qū)別，內(nèi)部原理

相信兩種方式大家都用過，但未必所有人都知道其區(qū)別，內(nèi)部原理。

// 方式1
function func1(x,y){
// your code
}
// 方式2
var func2 = function(x,y){
// your code
}

方式1 是典型的函數(shù)聲明(Function declarations)。
方式2 是函數(shù)表達(dá)式(Function expressions)，將一個(gè)匿名函數(shù)賦值給一個(gè)變量?；蛘哒f方式2中創(chuàng)建了一個(gè)具有形參為x,y的匿名函數(shù)，然后把該匿名函數(shù)賦值給變量func2。

其主要區(qū)別在于：
1，函數(shù)聲明需顯示的指定函數(shù)名，這里是func1；函數(shù)表達(dá)式則使用匿名函數(shù)
2，方式1在代碼執(zhí)行之前(解釋期)被加載到作用域中，方式2則需在代碼執(zhí)行時(shí)(運(yùn)行期)加載

一個(gè)簡單示例就明白了它們在使用上的區(qū)別

復(fù)制代碼代碼如下:

alert(func1); // --> func1源碼
alert(func2); // --> undefined
// 方式1
function func1(x,y){
// your code
}
// 方式2
var func2 = function(x,y){
// your code
}

可以看到，第一次彈出的是func1的源碼，第二次卻是undefined。即采用方式1(函數(shù)聲明)定義函數(shù)，可以在該函數(shù)代碼之上使用它，采用方式2(函數(shù)表達(dá)式)定義函數(shù)則不能在其定義前使用，只能在其定義后使用。

其內(nèi)部涉及到執(zhí)行上下文(Execution context)及激活對象(Activation object)。想更深了解的請閱讀EcmaScript 5文檔。

最近發(fā)現(xiàn)越來越多的人喜歡使用方式2定義函數(shù)，尤其在嵌套函數(shù)中。如單純的定義一個(gè)函數(shù)個(gè)人還是習(xí)慣方式1。