setTimeout-Callback-Argument

Lesezeit: 3 Minuten

setTimeout Callback Argument
jsnewman

Betrachten wir dieses Stück JavaScript:

function Person(name) {
    this.name = name;
}

Person.prototype.showName = function() {
    alert(this.name);
}


var mike = new Person("mike");
//mike.showName();  

window.name = "window"; 

Ich verstehe den Unterschied zwischen dem Verhalten von nicht

setTimeout(mike.showName(), 5000);

und

setTimeout(function(){
    mike.showName();
}, 5000);

Warum ist das Verhalten anders? Es verwirrt mich wirklich. Danke.

  • Ich bin mir ziemlich sicher, dass das OP “Verhalten” bedeutet, wenn er “Leistung” sagt.

    – Wayne

    2. April 2011 um 0:22 Uhr

1647155709 895 setTimeout Callback Argument
Wayne

Ihre Frage hat wirklich gar nichts zu tun mit setTimeout. Sie müssen lediglich den Unterschied zwischen einem Funktionsaufruf und einer Referenz auf eine Funktion verstehen.

Betrachten Sie diese vier Aufgaben:

var one = function() { mike.showName(); };
var two = mike.showName;
var three = mike.showName();
var four = (function() { mike.showName(); })();

Die ersten beiden weisen ihren jeweiligen Variablen eine Referenz auf eine Funktion zu. Die letzten beiden jedoch Anruf Funktionen (dafür sind die Klammern da) und weisen ihre Rückgabewerte den Variablen auf der linken Seite zu.

Wie dies mit setTimeout zusammenhängt:

Die setTimeout Die Funktion erwartet als erstes Argument a Hinweis zu einer Funktion, also entweder one oder two oben wäre richtig, aber three und four würde nicht. Es ist jedoch wichtig zu beachten, dass es sich streng genommen nicht um a handelt Fehler um den Rückgabewert einer Funktion zu übergeben setTimeoutobwohl Sie das oft sehen werden.

Das ist zum Beispiel völlig in Ordnung:

function makeTimeoutFunc(param) {
    return function() {
        // does something with param
    }
}

setTimeout(makeTimeoutFunc(), 5000);

Es hat nichts damit zu tun wie setTimeout erhält eine Funktion als Argument, aber dass es tut.

  • Vielen Dank Alter. Ihre Antwort ist großartig. Allerdings habe ich noch eine Verwirrung. Können Sie mir sagen, warum „mike.showName()“ zuerst ausgeführt wird, während „function(){ mike.showName()“ seine 5 Sekunden wartet? Danke noch einmal.

    – jsnewman

    2. April 2011 um 1:15 Uhr

  • @jsnewman – Passieren mike.showName() sagt, um die Funktion auszuführen showName gerade jetzt und übergeben Sie alles, was es zurückgibt, als Rückruf, der in 5 Sekunden ausgeführt werden soll (was nichts ist). Allerdings vorbei function(){ mike.showName() } bietet setTimeout mit einer anonymen Funktion, die ab jetzt in fünf Sekunden ausgeführt wird. Fünf Sekunden vergehen und die äußere Wrapper-Funktion wird ausgeführt. Es enthält eine Zeile, die der Aufruf ist showNamedie zu diesem Zeitpunkt ausgeführt wird.

    – Wayne

    2. April 2011 um 8:28 Uhr

1647155710 779 setTimeout Callback Argument
JCOC611

Wenn die akzeptierte Antwort einfach zu lang zum Lesen ist:

setTimeout(mike.showName(), 5000);

Dies wird alles ausführen mike.showName() kehrt zurück nach 5.000 Millisekunden.

setTimeout(function(){ mike.showName(); }, 5000);

Dadurch wird die anonyme Funktion nach 5000 Millisekunden ausgeführt, die aufruft mike.showName() , die eigentliche Funktion.

Eine andere Möglichkeit, denselben Effekt zu erzielen:

setTimeout(mike.showName.bind(mike), 5000);

Es ist kein Leistungsproblem. Eine der Möglichkeiten, die Sie gezeigt haben, funktioniert einfach nicht (sie ruft die Funktion sofort auf, anstatt wenn das Timeout ausgelöst wird).

setTimeout(mike.showName(), 5000); wird die ausführen showName Funktion und setzt ihren Rückgabewert als Timeout-Callback, der nicht funktioniert.

setTimeout(function(){ mike.showName(); }, 5000); erstellt eine anonyme Funktion und legt diese als Timeout-Callback fest. Wenn das Timeout ausgelöst wird, wird die Funktion aufgerufen und ruft Ihre auf showName() Funktion.

Fyi, setTimeout('mike.showName();', 5000); würde auch funktionieren. Aber mach das nicht – Es ist genauso schlimm wie zu konsumieren eval(). Außerdem macht es Ihren Code weniger lesbar, da der Code in der Zeichenfolge nicht syntax-hervorgehoben werden kann.

  • Können Sie mir sagen, warum „mike.showName()“ zuerst ausgeführt wird, während „function(){ mike.showName()“ auf seine Zeit wartet? Vielen Dank.

    – jsnewman

    2. April 2011 um 0:28 Uhr

  • Weil Sie die Funktion tatsächlich in dieser Zeile aufrufen. Wenn Sie es in eine anonyme Funktion einschließen oder die Funktion einfach ohne übergeben () es wird nicht aufgerufen – die Funktion selbst wird übergeben.

    – Meister der Diebe

    2. April 2011 um 7:48 Uhr

setTimeout(mike.showName(), 5000); führt aus mike.showName() sofort und übergibt den Rückgabewert an setTimeout()

setTimeout(function(){ mike.showName(); }, 5000); übergibt stattdessen einen Zeiger auf die Funktion. Dieser Weg setTimeout kann die Funktion anstelle ihres Rückgabewerts ausführen.

996360cookie-checksetTimeout-Callback-Argument

This website is using cookies to improve the user-friendliness. You agree by using the website further.

Privacy policy