在一個對象中的函數

Question

JS-folks， 我有一個小測試腳本的問題。

我有這個JS：

var button = { 
    lastClick: 0, 
    nowTime: new Date().getTime(), 
    go: function() { 
     var diff = this.nowTime - this.lastClick; 
     if (diff < 3000) alert('Too fast:' + diff/1000); 
     lastClick = this.nowTime; 
    }.bind(this) 
}; 

而這個HTML：

<input type="button" value="Go" onClick="button.go();" /> 

的go - 函數應該使用nowTime和lastClick值從我button -object但他們未定義。有誰能夠幫助我？

JS-Fiddle

Answer 1

這是因爲this是不確定的，當你做出的綁定（所以你結合window）。

你可以這樣做：

var button = { 
    lastClick: 0, 
    nowTime: new Date().getTime() 
}; 
button.go = function() { 
    var diff = this.nowTime - this.lastClick; 
    if (diff < 3000) alert('Too fast:' + diff/1000); 
    this.lastClick = this.nowTime; 
}.bind(button); 

你也是一個this.前lastClick失蹤。

另一種方法是使用一個封閉件/工廠：

var button = (function(){ 
    var lastClick = 0; 
    var nowTime = new Date().getTime(); 
    return { 
    go: function() { 
     var diff = nowTime - lastClick; 
     if (diff < 3000) alert('Too fast:' + diff/1000); 
     lastClick = nowTime; 
    } 
    } 
})(); 

差（其可以是或不適合你一個好處）是，按鈕的內部狀態被隱藏在這個版本（字段通常被認爲是「私人的」）。

如果你想nowTime始終是當前的時間，不存儲它：

var button = (function(){ 
    var lastClick = 0; 
    return { 
    go: function() { 
     var nowTime = new Date().getTime(); 
     var diff = nowTime - lastClick; 
     if (diff < 3000) alert('Too fast:' + diff/1000); 
     lastClick = nowTime; 
    } 
    } 
})();