So verwenden Sie "setTimeout", um das Objekt selbst aufzurufen

Question

Warum kann ich nicht benutzen? setTimeout in einem JavaScript -Objekt?

Message = function () {

    ...
    ...        

    this.messageFactory = ...
    this.feedbackTag = document.getElementById('feedbackMessages');

    this.addInfo = function (message) {
        var info = this.messageFactory.createInfo(message); // create a div
        this.feedbackTag.appendChild(info);

        setTimeout('this.feedbackTag.removeChild(info)', 5000);
        // why in here, it complain this.feedbacktag is undefined ??????

    };
}

Vielen Dank für die Lösung von Steve, jetzt funktioniert es, wenn der Code wie unten ist ... denn das "This" -Tokument zeigte tatsächlich auf die Funktion innerhalb von SetTimeout, er kann keine Meldung wiederholen.

Message = function () {

    ...
    ...        

    this.messageFactory = ...
    this.feedbackTag = document.getElementById('feedbackMessages');

    this.addInfo = function (message) {
        var info = this.messageFactory.createInfo(message); // create a div
        this.feedbackTag.appendChild(info);

        var _this = this;
        setTimeout(function() { _this.feedbackTag.removeChild(info); }, 5000);

    };
}

Aber warum funktioniert es nicht, wenn wir dies tun:

Message = function () {

    ...
    ...        

    this.messageFactory = ...
    this.feedbackTag = document.getElementById('feedbackMessages');
    // public function
    this.addInfo = function (message) {
        var info = this.messageFactory.createInfo(message); // create a div
        this.feedbackTag.appendChild(info);

        delayRemove(info);

    };
    // private function
    function delayRemove(obj) {
        var _this = this;
        setTimeout(function() { _this.feedbackTag.removeChild(info); }, 5000);
    }
}

Answer 1

Versuchen Sie, diese Zeile zu ersetzen:

setTimeout('this.feedbackTag.removeChild(info)', 5000);

Mit diesen beiden Zeilen:

var _this = this;
setTimeout(function() { _this.feedbackTag.removeChild(info); }, 5000);

Notiz:

Niemals bestehen setTimeout eine Zeichenfolge, wie diese hervorrufen eval (was Sie nur bei Bedarf verwenden sollten). Stattdessen passieren setTimeout Eine Funktionsreferenz (dies kann eine anonyme Funktion sein).

Schließlich überprüfen Sie immer das die this Das Schlüsselwort zeigt auf das, worauf Sie denken, dass es zeigt (siehe http://www.alistapart.com/articles/getoutbindingsituations).

Adressierung Frage 2:

Ich glaube das für normale Funktionen, this ist auf die eingestellt window Objekt - unabhängig davon, wo sie deklariert werden. Wenn Sie also den Code in eine separate Funktion verschieben, würde das Problem nicht behoben.

Answer 2

Ein ordentlicher Weg ist, nur zu bestehen Dies Als Argument für die Funktion, die in der Zeitüberschreitung aufgerufen wird:

function delayRemove(obj) {
  setTimeout(function(_this) {
      _this.feedbackTag.removeChild(obj);
    }, 5000, this);
}

Du solltest wirklich passieren obj Auch als Argument, nur um sicherzustellen, dass es sich im Bereich befindet (die Anzahl der Parameter ist unbegrenzt):

function delayRemove(obj) {
  setTimeout(function(_this, removeObj) {
      _this.feedbackTag.removeChild(removeObj);
    }, 5000, this, obj);
}

---

Html5 und node.js erweiterten die setTimeout Funktion zum Akzeptieren von Parametern, die an Ihre Rückruffunktion übergeben werden. Es hat die folgende Methodensignatur.

setTimeout(callback, delay, [param1, param2, ...])

Wie setTimeout Ist eigentlich keine JavaScript -Funktion Ihre Ergebnisse können zwischen den Browsern variieren. Ich konnte keine konkreten Details zur Unterstützung finden, aber wie ich sagte, dies ist in der HTML5 -Spezifikation.

Answer 3

Um Ihre letzte Frage zu beantworten: "Warum funktioniert es nicht, wenn wir das tun?"

Message = function () {

...
...        

this.messageFactory = ...
this.feedbackTag = document.getElementById('feedbackMessages');
// public function
this.addInfo = function (message) {
    var info = this.messageFactory.createInfo(message); // create a div
    this.feedbackTag.appendChild(info);

    delayRemove(info);

};
// private function
function delayRemove(obj) {
    var _this = this;
    setTimeout(function() { _this.feedbackTag.removeChild(info); }, 5000);
}}

Es funktioniert nicht, weil Sie eine undefinierte Variable bestehen (info) anstelle einer definierten Variablen (obj). Hier ist die korrigierte Funktion:

function delayRemove(obj) {
var _this = this;
setTimeout(function() { _this.feedbackTag.removeChild(obj); }, 5000);}