理解javascript中的回調(diào)函數(shù)(callback)
最近在看 express,滿眼看去,到處是以函數(shù)作為參數(shù)的回調(diào)函數(shù)的使用。如果這個概念理解不了,nodejs、express 的代碼就會看得一塌糊涂。比如:
app.use(function(req, res, next) {
var err = new Error('Not Found');
err.status = 404;
next(err);
});
app是對象,use是方法,方法的參數(shù)是一個帶參的匿名函數(shù),函數(shù)體直接在后面給出了。這段代碼怎么理解呢?我們先來了解回調(diào)函數(shù)這個概念。
首先要了解,在 js 中,函數(shù)也是對象,可以賦值給變量,可以作為參數(shù)放在函數(shù)的參數(shù)列表中。比如:
var doSomething = function(a,b)
{
return a + b;
}
這段代碼的意思是定義一個匿名函數(shù),這個匿名函數(shù)除了沒有名字之外,其他跟普通的函數(shù)沒有什么兩樣。然后把匿名函數(shù)賦值給變量doSomething。接下來我們調(diào)用:
console.log(doSomething(2,3));
這樣會輸出5。
回調(diào)函數(shù),就是放在另外一個函數(shù)(如 parent)的參數(shù)列表中,作為參數(shù)傳遞給這個 parent,然后在 parent 函數(shù)體的某個位置執(zhí)行。說來抽象,看例子:
// To illustrate the concept of callback
var doit = function(callback)
{
var a = 1,
b = 2,
c = 3;
var t = callback(a,b,c);
return t + 10;
};
var d = doit(function(x,y,z){
return (x+y+z);
});
console.log(d);
先定義 doit 函數(shù),有一個參數(shù) callback。這個 callback 就是回調(diào)函數(shù),名字可以任意取??春瘮?shù)體,先定義三個變量 a,b,c。然后調(diào)用 callback 函數(shù)。最后返回一個值。
下面就調(diào)用 doit 函數(shù)了。要注意的是,剛才定義 doit 時,callback 并沒有定義,所以剛才并不知道 callback 是干什么用的。這其實(shí)很好理解,我們平時定義函數(shù)的時候,參數(shù)也只是給出了一個名字,比如 a,在函數(shù)體中使用 a,但整個過程也并不知道 a 到底是什么,只有在調(diào)用那個函數(shù)的時候才指定 a 的具體值,比如2.回過頭來,在調(diào)用 doit 的時候,我們就需要指定 callback 究竟是個什么東西了??梢钥吹剑@個函數(shù)完成了一個 sum 功能。
上述代碼的執(zhí)行過程是:
調(diào)用 doit函數(shù),參數(shù)是一個匿名函數(shù);進(jìn)入 doit 的函數(shù)體中,先定義 a,b,c,然后執(zhí)行剛才的匿名函數(shù),參數(shù)是 a,b,c,并返回一個 t,最后返回一個 t+10給 d。
回到最初的例子,app.use(...)是函數(shù)調(diào)用。我們可以想象,之前一定定義了一個 use 方法,只是這里沒有給出。這兩個例子一對比,就可以馬上理解了。
在使用nodejs、express 的時候,不可能每個方法或函數(shù)我們都要找到它的函數(shù)定義去看一看。所以只要知道那個定義里面給 callback 傳遞了什么參數(shù)就行了。然后在調(diào)用方法或函數(shù)時,在參數(shù)里我們自己定義匿名函數(shù)來完成某些功能。
Over!
相關(guān)文章
JavaScript運(yùn)行機(jī)制之事件循環(huán)(Event Loop)詳解
這篇文章主要介紹了JavaScript運(yùn)行機(jī)制之事件循環(huán)(Event Loop)詳解,本文從多個方面講解了Event Loop,需要的朋友可以參考下2014-10-10JS+CSS實(shí)現(xiàn)電子商務(wù)網(wǎng)站導(dǎo)航模板效果代碼
這篇文章主要介紹了JS+CSS實(shí)現(xiàn)電子商務(wù)網(wǎng)站導(dǎo)航模板效果代碼,涉及JavaScript結(jié)合css動態(tài)操作頁面元素屬性的相關(guān)技巧,非常具有實(shí)用價值,需要的朋友可以參考下2015-09-09bootstrap學(xué)習(xí)使用(導(dǎo)航條、下拉菜單、輪播、柵格布局等)
這篇文章主要為大家詳細(xì)介紹了bootstrap框架、導(dǎo)航條、下拉菜單、輪播廣告carousel、柵格系統(tǒng)布局、標(biāo)簽頁tabs等相關(guān)資料,具有一定的參考價值,感興趣的小伙伴們可以參考一下2016-12-12javascript實(shí)現(xiàn)數(shù)字倒計(jì)時特效
這篇文章主要介紹了javascript實(shí)現(xiàn)網(wǎng)頁倒計(jì)時數(shù)字時鐘效果,是一款非常實(shí)用的javascript倒計(jì)時特效,具有一定參考借鑒價值,需要的朋友可以參考下2016-03-03用Javascript評估用戶輸入密碼的強(qiáng)度實(shí)現(xiàn)代碼
用Javascript評估用戶輸入密碼的強(qiáng)度實(shí)現(xiàn)代碼,需要的朋友可以參考下。2011-11-11javascript文件加載管理簡單實(shí)現(xiàn)方法
這篇文章主要介紹了javascript文件加載管理簡單實(shí)現(xiàn)方法,可實(shí)現(xiàn)順序加載所有js文件的功能,非常簡單實(shí)用,需要的朋友可以參考下2015-07-07