Gibt es einen Vorteil, eine Callback-Funktion hier (JavaScript) zu verwenden?

Question

Aus irgendeinem Grund habe ich Probleme, meinen Kopf um Rückruffunktionen in JS zu wickeln. Ich denke, dass es endlich geklickt hat, wie man sie benutzt (sorta), aber ich kann immer noch nicht herausfinden, warum ich das tun müsste. Wie unterscheiden sich diese beiden Codeteile und warum sollte die Callback-Version besser sein? Beide machen das Gleiche. Sie beide beseitigen die Notwendigkeit für doppelten Code. Sie haben ungefähr die gleiche Dateigröße. Es ist mir nicht klar, warum ich das Callback-Beispiel über den ersten verwenden würde - zumindest wenn es darum geht, doppelten Code zu verhindern (das ist der Grund, warum ich einen Callback so verwende).

Version 1

// no need to pass a function -- not a callback 
    function addNumsAndMultiply(num1, num2) { 
     findSum(num1, num2); 
     var product = num1 * num2; 
     alert("The product of " + num1 + " and " + num2 + " is: " + product); 
    } 

    function addNumsAndDivide(num1, num2) { 
     findSum(num1, num2); 
     var quotient = num1/num2; 
     alert("The quotient of " + num1 + "/" + num2 + " is: " + quotient); 
    } 

    function findSum(num1, num2) { 
     var sum = num1 + num2; 
     alert("The sum of " + num1 + " and " + num2 + " is: " + sum); 
    } 

    addNumsAndMultiply(3,4); 
    addNumsAndDivide(30,5); 

Version 2

// passed the function -- this is a callback 
    function addNumsAndWhat(num1, num2, callback) { 
     var sum = num1 + num2; 
     alert("The sum of " + num1 + " and " + num2 + " is: " + sum); 
     callback(num1,num2); 
    } 

    function multiply(num1, num2) { 
     var product = num1 * num2; 
     alert("The product of " + num1 + " and " + num2 + " is: " + product); 
    } 

    function divide(num1, num2) { 
     var quotient = num1/num2; 
     alert("The quotient of " + num1 + "/" + num2 + " is: " + quotient); 
    } 

    addNumsAndWhat(3,4,multiply); 
    addNumsAndWhat(30,5,divide); 

Answer 1

Der Hauptvorteil in Ihrem Szenario ist für Abstraktion und Modularität einer Callback-Funktion zu verwenden.

Die Funktion:

addNumsAndWhat(); 

Ermöglicht Ihnen es zwei Zahlen zu geben, fügen Sie sie, und verwenden Sie die Callback-Funktion sie in irgendeiner Weise zu manipulieren, wo wie die Funktionen:

addNumsAndMultiply(); 
addNumsAndDivide(); 

sind sehr spezifisch in was sie tun.

Zusammenfassend, es gibt keinen wirklichen Vorteil für die Verwendung eines Rückrufs, wie Sie derzeit sind, es sei denn, Sie interessieren sich für die kleine Bonus-Modularität mit diesem Rückruf.

Answer 2

Sie tun die Rückrufe richtig, aber es macht keinen Sinn, wo Sie sie verwenden.

Der größte Knall für das Geld in Javascript Callbacks ist in asynchronen Operationen - zum Beispiel einen Netzwerkanruf. Hier ist ein Beispielcode:

http://www.w3schools.com/ajax/tryit.asp?filename=tryajax_first

Es ist sehr einfach - Sie treten den Anruf ab und es eine Funktion geben zu rufen, wenn es fertig ist. Sie brauchen nicht abzufragen oder andere Synchronisations-Sachen zu machen, Sie warten nur darauf benachrichtigt zu werden, wenn es fertig ist, gescheitert usw.

Answer 3

Es gibt einen kleinen Vorteil für die Callback-Methode, aber in diese verwenden-verwenden Sie es kann zu viel des Guten:

/die Funktion übergeben - das ist eine Callback-Funktion addNumsAndWhat (num1, num2, Rückruf) { var sum = num1 + num2; alert ("Die Summe von" + num1 + "und" + num2 + "ist:" + sum); Rückruf (num1, num2); }

function multiply(num1, num2) { 
    var product = num1 * num2; 
    alert("The product of " + num1 + " and " + num2 + " is: " + product); 
} 

function divide(num1, num2) { 
    var quotient = num1/num2; 
    alert("The quotient of " + num1 + "/" + num2 + " is: " + quotient); 
} 

addNumsAndWhat(3,4,multiply); 
addNumsAndWhat(30,5,divide); 

Sie sagen, könnten so etwas wie:

task = { 
    multiply: multiply, 
    divide: divide 
}; 

addNumsAndWhat(4, 5, task['divide']); 

So ein String-Argument ermöglicht weitergegeben werden, vielleicht von einem Konfigurationsobjekt oder ein Geschäft/Spiel Regel-Engine.

Answer 4

In den von Ihnen bereitgestellten Beispielen scheint die Verwendung von Callback nicht wirklich von Nutzen zu sein.In der Tat, obwohl Sie die Funktion aufgerufen als Parameter "Callback" nennen es wirklich nicht das Gefühl als solches. Eine echte Callback-Funktion ist typischerweise diejenige, wenn der Aufrufer das Ergebnis einer Funktion kennen muss, die eine asynchrone Operation sein kann oder nicht.

Js Fiddle example

Code:

// Asynchronous operation to fetch json 
function fetchJSON(cb) { 
    setTimeout(function() { 
    // When the work is done, we notify the caller 
    cb({ name: "maunovaha", age: 29 }, null); 
    }, 1000); 
} 

// Asynchronous call 
fetchJSON(function(data, error) { 
    if (error) { 
    console.log("Error occurred while fetching JSON: " + error); 
    return; 
    } 
    // Do something with the data 
    console.log(data); 
}); 

Also kurz gesagt, das obige Beispiel verwendet ein ähnliches Format von node.js Daten/Fehlerverarbeitung. Der Callback könnte anstelle von Daten auch den Fehler zurückgeben und würde dementsprechend angezeigt werden. Hoffentlich hilft das.