文共2416字，預(yù)計學(xué)習(xí)時長5分鐘

函數(shù)是編程中的關(guān)鍵部件之一。這些函數(shù)可執(zhí)行特定任務(wù)，并可反復(fù)調(diào)用執(zhí)行。將Javascript中的函數(shù)和其他編程語言中的函數(shù)相比較，其中最大的區(qū)別在于Javascript函數(shù)為一級對象，這意味著Javascript中的函數(shù)表現(xiàn)類似于對象，可作為變量、數(shù)組和其他對象。

本文就定義函數(shù)的三種不同方法進(jìn)行討論：

1. 函數(shù)聲明

2. 函數(shù)表達(dá)式

3. 生成器函數(shù)

1. 函數(shù)聲明

函數(shù)聲明可能是最常見的方式了。觀察如下語句：

function name (parameter)
{
 statements 
}

函數(shù)聲明語句

函數(shù)由關(guān)鍵字函數(shù)、函數(shù)的強制名稱和括號內(nèi)的參數(shù)組成（定義函數(shù)也可無參數(shù)）。最后，大括號內(nèi)則是函數(shù)的主體，用以執(zhí)行實際任務(wù)。

理解形參和實參的區(qū)別很重要。形參是定義函數(shù)時的一個變量。在調(diào)用函數(shù)時，實參則是輸入函數(shù)形參的實際數(shù)據(jù)。

首先，看一個簡單實例：

function hello(name)
{
console.log("Hello "+ name)
}
hello('stuti')
// Hello stuti
hello(12)
// Hello 12

名為hello的函數(shù)以實際參數(shù)名稱聲明，在控制臺記錄消息。從本例中，可以看出，因為實際參數(shù)上無指定類型，所以其既適用于string函數(shù)，也適用于number函數(shù)。倘若只是希望該函數(shù)是一個名稱而不是數(shù)值呢？很遺憾，由于Javascript中沒有預(yù)建法來實現(xiàn)這一點，必須手動確定輸入函數(shù)的實際參數(shù)類型，如下所示：

function hello(name) {
 if (typeof name==='string')
 console.log("Hello " + name)
 else
 console.log("Please input a Name")
}
hello(12) 
// Plese input a Name

默認(rèn)情況下，函數(shù)返回未定義變量。若要返回任何其他值，則函數(shù)必須具備返回語句，而由該語句指定返回值。

function something(){
}
console.log(something()) // undefined
function notSomething(){
 return 1
}
console.log(notSomething()) // 1

函數(shù)聲明中提升是什么？

簡單地說，這意味著在執(zhí)行代碼時，無論何處聲明函數(shù)或變量，它們均會移動至作用域的頂部。這也就是所謂的提升。

觀察下方實例：

myName()
// My name is Stuti Chahuhan
function myName() {
 console.log(`My name is Stuti Chauhan`)
}

函數(shù)聲明中的提升

此處甚至是在聲明之前就調(diào)用了這個函數(shù)——提升。

2. 函數(shù)表達(dá)式

函數(shù)表達(dá)式與函數(shù)聲明極為相似，連語句都不甚相同。最主要的區(qū)別在于函數(shù)表達(dá)式不以關(guān)鍵字函數(shù)開頭，且函數(shù)名稱可選，在此情況下，該函數(shù)表達(dá)式則可以成為一個匿名函數(shù)。如果函數(shù)有名稱，則將其稱為命名函數(shù)表達(dá)式。

let checkNumber=function check (num){
 return (num %2==0)?"even" : "odd"
 }
console.log(checkNumber(50)) 
// even

函數(shù)表達(dá)式的例子

現(xiàn)在來觀察一下定義上述函數(shù)的匿名法。

//Anonymous Function 
let checkNumber=function (num){
 return (num %2==0)?"even" : "odd"
 }
console.log(checkNumber(50)) 
// even

匿名函數(shù)表達(dá)式

函數(shù)聲明和函數(shù)表達(dá)式最關(guān)鍵的區(qū)別就在于函數(shù)表達(dá)式無提升功能。若在函數(shù)表達(dá)式中嘗試與提升函數(shù)聲明相同的項目，則會出現(xiàn)報錯。

myName()
// ReferenceError: myName is not defined
let myName=function () {
 console.log(`My name is Stuti Chauhan`)
}

函數(shù)表達(dá)式中無提升

IIFE（立即執(zhí)行函數(shù)表達(dá)式）

這意味著函數(shù)一旦定義就開始運行，而函數(shù)表達(dá)式附在分組操作符()中，

( function () {
 let num=4
 return num
 })
//4

為什么典型的函數(shù)表達(dá)式需要IIFE？一般定義一個函數(shù)，隨后多次調(diào)用。但倘若只想調(diào)用一次用來生成輸出，并且不再使用該函數(shù)呢？由此就出現(xiàn)了IIFE。該函數(shù)會立即執(zhí)行，并在以后不再經(jīng)程序訪問。因為不需再調(diào)用該函數(shù)，所以它也不需要名稱，因此匿名函數(shù)表達(dá)式首選IIFE。

3. 生成器函數(shù)

普通函數(shù)遵循運行-完成的模型，不能在執(zhí)行最后一行之前停止運行。若想在執(zhí)行過程中退出，必須返回或拋出一個錯誤。

而生成器函數(shù)可以在執(zhí)行過程中停止。當(dāng)其調(diào)回時，仍然從停止的地方繼續(xù)。

該函數(shù)與普通函數(shù)一樣進(jìn)行聲明，但不同之處在于生成器函數(shù)在function關(guān)鍵字后面帶有星號*，其間可包含任意數(shù)量的空格。

還有一點需要注意:在JavaScript中，生成器是一個函數(shù)，該函數(shù)返回一個對象，在該對象上可調(diào)用next()，每次調(diào)用next()都會返回一個結(jié)構(gòu)如下的對象：

{ 
 value: Any,
 done: true|false
} 

此對象包含兩個屬性：value和done。Value是對象的實際值，而done規(guī)定了函數(shù)終止的屬性——默認(rèn)值為false，當(dāng)其變?yōu)閠rue時，則函數(shù)停止。

通過一個簡單的例子來理解這點：

function * generatorFunction()
{ 
 console.log('first to execute');
 yield 'takes a pause'; 
 
 console.log(' printed after the pause'); 
 yield 'end of the function';
 
}
const gen=generatorFunction();
console.log(gen.next().value); // first to execute
 // takes a pause
console.log(gen.next().value); // printed after the pause
 // end of the function
console.log(gen.next().value); 
 // undefined

函數(shù)本體中，不使用return關(guān)鍵字——而是使用yeild，如果使用了return，則會將done屬性更改為true，函數(shù)將結(jié)束——之后的任何操作都不會執(zhí)行。Yield給出為其分配的值。

首先，在調(diào)用函數(shù)前先定義函數(shù)，同時調(diào)用一個生成器函數(shù)，形成一個生成器對象，存儲在變量中。

然后在使用next()和value屬性時調(diào)用對象。第一次使用next()時，函數(shù)執(zhí)行開始。首先，運行console.log (“首次執(zhí)行”)并將其記錄在控制臺中，然后遇到y(tǒng)ield—輸出 “暫停”值，執(zhí)行停止。

第二次調(diào)用next()時，它從上次暫停處繼續(xù)。同樣，首先運行console.log()，再次遇到y(tǒng)ield，生成“函數(shù)結(jié)束”值，函數(shù)停止。

第三次調(diào)用next()時，結(jié)果是未定義。這是因為由生成器函數(shù)生成的對象只能迭代一次——該對象現(xiàn)在是無用的，必須生成一個新對象才能重新啟動程序。

function* generator() {
 yield "some value";
 return "ends here";
 yield "will never execute";
 yield "never reach here"
}
var gen=generator()
console.log(gen.next()); 
// { value: "some value", done: false }
console.log(gen.next()); 
// { value: "ends here", done: true }
console.log(gen.next()); 
// { value: undefined, done: true }
console.log(gen.next()); 
// { value: undefined, done: true }

如果使用return而不是yield，那么數(shù)據(jù)的值就會被更改為true，之后就不會執(zhí)行任何操作。與Promise結(jié)合使用時，就異步編程而言，生成器是一個非常強大的工具。該函數(shù)即使不能完全消除回調(diào)的問題，也可以減輕其問題的程度。

結(jié)論：哪種方法更好？

事實上，我們不能將其進(jìn)行比較，然后說一個比另一個好——聲明的類型還是取決于具體情況或條件。

為實現(xiàn)更好的異步功能則使用生成器函數(shù)，針對立即執(zhí)行函數(shù)的情況，則使用匿名函數(shù)表達(dá)式。

留言 點贊 關(guān)注

我們一起分享AI學(xué)習(xí)與發(fā)展的干貨

編譯組：柳玥、溫媛

相關(guān)鏈接：

https://medium.com/better-programming/three-ways-to-define-functions-in-javascript-750a908e51d9

如需轉(zhuǎn)載，請后臺留言，遵守轉(zhuǎn)載規(guī)范