这里是新手问题。
我试图更好地理解回调函数。在这里阅读有关它们的信息时,尽管我掌握了这个主意。
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
有人可以解释为什么输出按此顺序吗?该错误指的是什么,即使代码已完成,为什么还会出现该错误?
我首先按照相同的结构做了一个简单的回调函数,并且效果很好。
预先感谢 布拉德
答案 0 :(得分:4)
您很亲密,但是在传递timeOfDay("evening")
时,实际上并没有传递该函数作为回调。那是一个函数调用,它立即运行,无论返回值是多少,它都是作为第二个参数传递给greeting
函数调用的。由于timeOfDay
不返回任何内容,因此您要将undefined
传递给greeting
。
解决方案是将一个实际函数而不是调用一个函数的结果(除非结果实际上是另一个函数)传递给greeting
,而我们可以做到这一点的一种方法是将{匿名函数声明中的{1}}函数调用,如下所示:
timeOfDay()
另一种方法是使用 Function.bind()
方法,该方法返回您调用它的函数的副本,但是您可以配置函数将在其中执行的上下文,根据您传递给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') } );
的第一个参数。这是一种非常有用的技术,但是需要对范围和上下文有很好的了解和理解,您可以阅读有关 in another answer of mine 的更多信息:
.bind()
答案 1 :(得分:1)
如评论中所述,当您执行以下操作时:
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/en-US/docs/Web/JavaScript/Reference/Global_objects/Function/bind