Besseres Verständnis der Rückruffunktionen in JavaScript

Ich verstehe es, eine Funktion als Rückruf an eine andere Funktion zu übergeben und ausführen zu lassen, aber ich verstehe nicht die beste Implementierung, um dies zu tun. Ich suche ein sehr einfaches Beispiel wie dieses:

var myCallBackExample = {
    myFirstFunction : function( param1, param2, callback ) {
        // Do something with param1 and param2.
        if ( arguments.length == 3 ) {
            // Execute callback function.
            // What is the "best" way to do this?
        }
    },
    mySecondFunction : function() {
        myFirstFunction( false, true, function() {
            // When this anonymous function is called, execute it.
        });
    }
};

Wenn ich in myFirstFunction einen neuen Rückruf () zurückgebe, funktioniert dies und führt die anonyme Funktion aus, aber das scheint mir nicht der richtige Ansatz zu sein.

Das kann man einfach sagen

callback();

Alternativ können Sie die callMethode verwenden, wenn Sie den Wert thisinnerhalb des Rückrufs anpassen möchten .

callback.call( newValueForThis);

Innerhalb der Funktion thiswäre was auch immer newValueForThis.

Sie sollten überprüfen, ob der Rückruf vorhanden ist und eine ausführbare Funktion ist:

if (callback && typeof(callback) === "function") {
    // execute the callback, passing parameters as necessary
    callback();
}

Viele Bibliotheken (jQuery, Dojo, etc.) ein ähnliches Muster für ihre asynchronen Funktionen sowie node.js für alle Asynchron - Funktionen (NodeJS in der Regel passiert errorund dataan die Callback). Ein Blick in den Quellcode würde helfen!

Es gibt 3 Hauptmöglichkeiten, um eine Funktion auszuführen:

var callback = function(x, y) {
    // "this" may be different depending how you call the function
    alert(this);
};

1. Rückruf (Argument_1, Argument_2);
2. callback.call (some_object, argument_1, argument_2);
3. callback.apply (some_object, [argument_1, argument_2]);

Die von Ihnen gewählte Methode hängt davon ab, ob:

1. Sie haben die Argumente in einem Array oder als unterschiedliche Variablen gespeichert.
2. Sie möchten diese Funktion im Kontext eines Objekts aufrufen. In diesem Fall würde die Verwendung des Schlüsselworts "this" in diesem Rückruf auf das Objekt verweisen, das als Argument in call () oder apply () übergeben wurde. Wenn Sie den Objektkontext nicht übergeben möchten, verwenden Sie null oder undefiniert. Im letzteren Fall würde das globale Objekt für "dies" verwendet.

Dokumente für Function.call , Function.apply

Bei Rückrufen geht es um Signale und bei "Neu" geht es um das Erstellen von Objektinstanzen.

In diesem Fall wäre es noch angemessener, nur "callback ()" auszuführen. als "return new callback ()", weil Sie sowieso nichts mit einem Rückgabewert machen.

(Und der Argumentargument.length == 3-Test ist wirklich klobig, fwiw, besser zu überprüfen, ob der Rückrufparameter existiert und eine Funktion ist.)

Die richtige Implementierung wäre:

if( callback ) callback();

Dies macht den Rückrufparameter optional.

Sie können verwenden:

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

Das folgende Beispiel ist etwas umfassender:

function mySandwich(param1, param2, callback) {
  alert('Started eating my sandwich.\n\nIt has: ' + param1 + ', ' + param2);
  var sandwich = {
      toppings: [param1, param2]
    },
    madeCorrectly = (typeof(param1) === "string" && typeof(param2) === "string") ? true : false;
  if (callback && typeof(callback) === "function") {
    callback.apply(sandwich, [madeCorrectly]);
  }
}

mySandwich('ham', 'cheese', function(correct) {
  if (correct) {
    alert("Finished eating my " + this.toppings[0] + " and " + this.toppings[1] + " sandwich.");
  } else {
    alert("Gross!  Why would I eat a " + this.toppings[0] + " and " + this.toppings[1] + " sandwich?");
  }
});

Hier ist ein grundlegendes Beispiel, das die callback()Funktion in JavaScript erklärt:

var x = 0;

function testCallBack(param1, param2, callback) {
  alert('param1= ' + param1 + ', param2= ' + param2 + ' X=' + x);
  if (callback && typeof(callback) === "function") {
    x += 1;
    alert("Calla Back x= " + x);
    x += 1;
    callback();
  }
}

testCallBack('ham', 'cheese', function() {
  alert("Function X= " + x);
});

JSFiddle