Erstellen eines benutzerdefinierten Rückrufs in JavaScript

Question

Alles, was ich tun muss, ist, eine Callback-Funktion auszuführen, wenn meine aktuelle Funktionsausführung endet.

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

Ein Verbraucher für diese Funktion sollte folgendermaßen aussehen:

object.LoadData(success);

function success(loadedData , currentObject) 
{
  //Todo: some action here 
}

Wie kann ich das umsetzen?

Answer 1

Eigentlich wird Ihr Code ziemlich viel Arbeit, wie es ist, nur deklarieren Sie Ihre Callback als ein Argument und Sie können es direkt mit dem Argument Namen aufrufen.

Die Grundlagen

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);

Das ruft doSomething die Folgendes aufrufen wird foo , die darauf hinweist, dass "die Sachen hierher gehören".

Beachten Sie, dass es sehr wichtig ist, die Funktion référence ( foo ), anstatt die Funktion aufzurufen und ihr Ergebnis zu übergeben ( foo() ). In Ihrer Frage machen Sie es richtig, aber es lohnt sich, darauf hinzuweisen, weil es ein häufiger Fehler ist.

Fortgeschrittenere Dinge

Manchmal möchten Sie den Callback aufrufen, damit er einen bestimmten Wert für this . Das können Sie ganz einfach mit dem JavaScript call Funktion:

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`

Sie können auch Argumente übergeben:

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`

Manchmal ist es sinnvoll, die Argumente, die Sie dem Callback übergeben wollen, nicht einzeln, sondern als Array zu übergeben. Sie können verwenden apply um das zu tun:

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`

Answer 2

Es ist eine gute Praxis, sich zu vergewissern, dass der Rückruf eine tatsächliche Funktion ist, bevor man versucht, ihn auszuführen:

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

  callback();
}

Answer 3

Meine 2 Cent. Dasselbe, aber anders...

<script>
    dosomething("blaha", function(){
        alert("Yay just like jQuery callbacks!");
    });

    function dosomething(damsg, callback){
        alert(damsg);
        if(typeof callback == "function") 
        callback();
    }
</script>

Answer 4

function loadData(callback) {

    //execute other requirement

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

loadData(function(){

   //execute callback

});

Answer 5

   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 !");
});

\==============================================

Das Ergebnis ist:

hello world !