1

JavaScriptでOOPを学ぼうとしています。

特定のメールスレッドで費やされた時間を返すことになっている次のコードを作成しました。

function mailThread(url) {
    this.timerIsOn = true;
    this.c = 0;
    this.url = url;
    this.timerCounter = function () {
        if(this.timerIsOn) { //doesnt get called??
            console.log('timerison');
            this.c = this.c + 1;
            console.log(this.c);
        } else {
            this.windowTimeOpen = this.c
        }
    }
    this.timerInterval = setInterval(this.timerCounter, 1000);
}

mailThread1 = new mailThread('test');

ただし、 this.timerIsOn は undefined を返すように見えるため、タイマーが実行されません。ここで何が間違っていますか?

また、次の Fiddle でこれをテストしました: http://jsfiddle.net/B5vt5/

4

3 に答える 3

3

問題は、timerCounter という関数のスコープ内で、"this" が関数自体を参照していることです。これを行う:

function mailThread(url) {
    var self = this;
    self.timerIsOn = true;
    self.c = 0;
    self.url = url;
    self.timerCounter = function () {
    if (self.timerIsOn) { //Using self instead of this
        console.log('timerison');
        self.c=this.c+1;
        console.log(self.c);
    } else {
    self.windowTimeOpen = self.c
    }
    }
    self.timerInterval = setInterval(self.timerCounter,1000);
}

mailThread1 = new mailThread('test');

MDN の OOP 入門をご覧になることをお勧めします

于 2013-05-21T14:55:19.377 に答える
2

thisに与えるコールバック内のオブジェクトではsetTimeoutなく、グローバル オブジェクト ( window) です。解決策は、変数に保存することです:

var _this = this;
this.timerCounter = function () {
    if (_this.timerIsOn) { 
        console.log('timerison');
        _this.c++;
        console.log(_this.c);
    } else {
         _this.windowTimeOpen = _this.c
    }
}
于 2013-05-21T14:53:33.283 に答える
1

this.timerCounter関数です。それが呼び出されたとき、コンテキストがsetTimeout与えられているので、あなたが思っているものではありません。windowthis

.bind必要なものに設定するために使用する必要がありthisます。

this.timerInterval = setInterval(this.timerCounter.bind(this),1000);

thisまたは、変数に保存します。

var that = this;
this.timerCounter = function () {
    if (that.timerIsOn) {
        // use that instead of this
    }
}

this.timerInterval = setInterval(this.timerCounter,1000);
于 2013-05-21T14:55:12.357 に答える