在JavaScript中创建自定义回调

我所要做的就是当我的当前函数执行结束时执行一个回调函数。

function LoadData() { alert('The data has been loaded'); //Call my callback with parameters. For example, //callback(loadedData , currentObject); } 

这个功能的消费者应该是这样的:

 object.LoadData(success); function success(loadedData , currentObject) { //Todo: some action here } 

我如何实现这个?

实际上,你的代码几乎可以工作,只要将你的回调声明为一个参数,你可以直接使用参数名称来调用它。

基础

 function doSomething(callback) { // ... // Call the callback callback('stuff', 'goes', 'here'); } function foo(a, b, c) { // I'm the callback alert(a + " " + b + " " + c); } doSomething(foo); 

这将称为doSomething ,这将调用foo ,这将提醒“东西在这里”。

请注意,传递函数引用foo )非常重要,而不是调用函数并传递其结果( foo() )。 在你的问题中,你做得正确,但是值得指出,因为这是一个常见的错误。

更先进的东西

有时候你想调用回调函数,这样就可以看到具体的值。 您可以使用JavaScript call函数轻松完成此操作:

 function Thing(name) { this.name = name; } Thing.prototype.doSomething = function(callback) { // Call our callback, but using our own instance as the context callback.call(this); } function foo() { alert(this.name); } var t = new Thing('Joe'); t.doSomething(foo); // Alerts "Joe" via `foo` 

你也可以传递参数:

 function Thing(name) { this.name = name; } Thing.prototype.doSomething = function(callback, salutation) { // Call our callback, but using our own instance as the context callback.call(this, salutation); } function foo(salutation) { alert(salutation + " " + this.name); } var t = new Thing('Joe'); t.doSomething(foo, 'Hi'); // Alerts "Hi Joe" via `foo` 

有时将你想给回调的参数作为一个数组而不是单独传递是有用的。 你可以使用apply来做到这一点:

 function Thing(name) { this.name = name; } Thing.prototype.doSomething = function(callback) { // Call our callback, but using our own instance as the context callback.apply(this, ['Hi', 3, 2, 1]); } function foo(salutation, three, two, one) { alert(salutation + " " + this.name + " - " + three + " " + two + " " + one); } var t = new Thing('Joe'); t.doSomething(foo); // Alerts "Hi Joe - 3 2 1" via `foo` 

在尝试执行回调之前确保回调是一个实际的函数是一个好习惯:

 if (callback && typeof(callback) === "function") { callback(); } 

我的2分。 相同但不同…

 <script> dosomething("blaha", function(){ alert("Yay just like jQuery callbacks!"); }); function dosomething(damsg, callback){ alert(damsg); if(typeof callback == "function") callback(); } </script> 
 function loadData(callback) { //execute other requirement if(callback && typeof callback == "function"){ callback(); } } loadData(function(){ //execute callback }); 
  function callback(e){ return e; } var MyClass = { method: function(args, callback){ console.log(args); if(typeof callback == "function") callback(); } } 

==============================================

 MyClass.method("hello",function(){ console.log("world !"); }); 

==============================================

结果是:

 hello world ! 
 function LoadData(callback) { alert('the data have been loaded'); callback(loadedData, currentObject); } 

当调用回调函数时,我们可以像下面这样使用它:

consumingFunction(callbackFunctionName)

例:

 // Callback function only know the action, // but don't know what's the data. function callbackFunction(unknown) { console.log(unknown); } // This is a consuming function. function getInfo(thenCallback) { // When we define the function we only know the data but not // the action. The action will be deferred until excecuting. var info = 'I know now'; if (typeof thenCallback === 'function') { thenCallback(info); } } // Start. getInfo(callbackFunction); // I know now 

这是Codepend的完整例子。

尝试:

 function LoadData (callback) { // ... Process whatever data callback (loadedData, currentObject); } 

函数是JavaScript中的第一类; 你可以通过他们周围。