前幾天有間單提到該如何聲明函式及在Hositing中會發生什么事，但是函式的奧妙不僅于此。

?

身為一個使用JS的工程師，我們一定要熟悉函式到比戀人還熟！

?

這幾天將會把函式逐一扒開跟各位一起探討其中的奧妙。

?

函式是頭等物件

這句話代表著函式與任何JS物件共存，也被當成一個物件。

函式可以被當成變量引用、用實值作聲明，或是作為函式參數傳遞。

?

這個我們在前幾天雖然有提到，但并沒有說為什么函式可以這樣作，今天就有說明到是因為頭等物件所造成的，也讓大家復習一下：

?

//實質建立

function myFun（）{}

?

//指派給變量、數組或其他物件屬性

var myFun = function（）{}；

?

var myArr = []；

myArr.push（function（）{}）；

?

var myObj = {}；

myObj.funA = function（）{}；

?

//作為參數傳遞給其他函式

function myFun（val）{

val（）；

}

myFun（function（）{}）；

?

//作為函式的回傳值

function myFun（）{

return function（）{}

}

?

//動態建立和指派屬性

var myFun = function（）{}；

myFun.data =“Hola”；

回呼函式Callback function

頭等物件的其中一樣特性，可以作為參數傳遞給函式，而在某個時間點，可能會呼叫這個被傳入的函式，這就是「回呼函式」的概念。

?

每當我們設置一個準備在之后呼叫的函式，不論是透過瀏覽器的事件處理階段或是透過其他代碼，這個行為就是在設置一個回呼函式。我們可以這樣解釋：這個被建立的函式，會在稍候某個適當的時機點，由其他代碼「回呼」（call back）。

?

這會或還是有點難以理解，不過你或許已經使用過回呼函式只是你不知道而已，不論是最簡單的按鈕按下執行程序還是從服務器接收數據，這都是回呼函式！

?

我們來看一個最簡單的示例：

?

var text = 'get Text'；

function unlessFun（callback）{

console.log（'In unlessFUn'）；

return callback（）；

}

function getText（）{

console.log（'In getTxt function'）；

return text；

}

unlessFun（getText）；

執行后會得到如下圖：

?

或許你認為我直接在unlessFun里面印出text就好了啊，為什么要用回呼函式多此一舉。

那也許接下來這個示例會讓你體驗到回呼函式的美好：

?

如果我們今天有一組數字[2,1,6,12,3,77,100,4]需要做比較大小，這時候可能很多人就會開始自己寫個算法的函式，像是這樣：

?

var arr = [2,1,6,12,3,77,100,4]；

function compare（val）{

for（let i = 0；i<val.lenght；i++）{

…

}

}

也許你花了好幾天終于寫出了這個算法，但是其實我們可以發現JS早就幫你寫好了一個sort（）函式，

你可以拿來用，只需要寫好回呼函式：

?

var arr = [2,1,6,12,3,77,100,4]；

arr.sort（function（a，b）{

return a - b；

}）；

console.log（arr）；//[1，2，3，4，6，12，77，100]

我們不需要考慮算法的底層細節，JS早就針對這些算法函式進行最佳化了，沒有必要重復造輪子而且造出來的性能還不一定比較好，所以學好回呼函式并使用他們吧！

?

參考資料：

忍者Javascript開發技巧探討

轉載于:https://www.cnblogs.com/lannyQ-Q/p/9920555.html

總結

以上是生活随笔為你收集整理的学习JS的心路历程-函式（一）的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。