[英]New to callback functions (passing a callback as parameter)(Javascript)
新手問題在這里。
我試圖更好地理解回調函數。 在這里閱讀有關它們的信息時,盡管我掌握了這個主意。
function greeting (name, callback){ console.log(`Greetings ${name}`); callback(); }; function timeOfDay (time){ console.log(`How are you this fine ${time}?`); }; greeting ('Brad', timeOfDay('evening') );
輸出量
How are you this evening?
Greetings Brad
Uncaught TypeError: callback is not a function
有人可以解釋為什么輸出按此順序嗎? 此錯誤指的是什么,即使代碼已完成,為什么還會出現此錯誤?
我首先按照相同的結構做了一個簡單的回調函數,並且效果很好。
預先感謝布拉德
您已經關閉了,但是當傳遞timeOfDay("evening")
,實際上並沒有傳遞該函數作為回調。 那是一個函數調用,它立即運行,無論返回值是什么,它都是作為第二個參數傳遞給greeting
函數調用的。 由於timeOfDay
不返回任何內容,因此您將undefined
傳遞給greeting
。
解決方案是將一個實際函數而不是調用一個函數的結果(除非結果實際上是另一個函數)傳遞給greeting
,而我們可以做到的一種方法是將timeOfDay()
函數調用包裝在匿名函數中函數聲明,如下所示:
function greeting (name, callback){ console.log(`Greetings ${name}`); callback(); }; function timeOfDay (time){ console.log(`How are you this fine ${time}?`); }; greeting ('Brad', function() { timeOfDay('evening') } );
另一種技術是使用Function.bind()
方法,該方法返回您調用過的函數的副本,但是您可以根據傳遞給的第一個參數來配置函數將在其中執行的上下文.bind()
。 這是一種非常有用的技術,但是需要對范圍和上下文有很好的了解和理解,您可以在我的另一個答案中了解更多:
function greeting (name, callback){ console.log(`Greetings ${name}`); callback(); }; function timeOfDay (time){ console.log(`How are you this fine ${time}?`); }; greeting ('Brad', timeOfDay.bind(this,'evening') );
如評論中所述,當您執行以下操作時:
greeting ('Brad', timeOfDay('evening') );
您將立即調用timeOfDay
函數。
為避免這種情況,您可以使用以下選項之一:
如另一個答案中所述,將函數調用包裝在匿名函數中。
您可以省略/刪除括號,例如: greeting('Brad', timeOfDay);
(這避免了立即調用函數,但是您將丟失參數"evening"
,並且錯誤將持續存在)。
您可以.bind()
上下文的功能,在下面的例子中,我結合this
作為背景的功能,這樣它不會瞬間調用的函數。
看一看:
function greeting (name, callback){ console.log(`Greetings ${name}`); callback(); }; function timeOfDay (time){ console.log(`How are you this fine ${time}?`); }; greeting ('Brad', timeOfDay.bind(this, 'evening') );
進一步閱讀: https : //developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_objects/Function/bind
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.