將javascript/Type腳本的2個函數合併爲一個

我有一個Date變量，並且我每秒更新一次以使其生效。將javascript/Type腳本的2個函數合併爲一個

現在，這裏是我的變量。

var stationdate = new Date(data.localTime);

我的Javascript代碼更新它每秒。

window.setInterval(function() {   
    stationdate = new Date(stationdate.setSeconds(stationdate.getSeconds() + 1));    
    }, 1000);

而且我腳本類型代碼，使其返回到角UI。

window.setInterval(() => this.time = stationdate, 1000);

我的問題。

如果兩個函數都是分離的，它就可以很好地工作。

但它停止工作，如果我把它們合併。

見下文。

window.setInterval(function() {   
    stationdate = new Date(stationdate.setSeconds(stationdate.getSeconds() + 1)); 
    this.time = stationdate;    
    }, 1000);

我缺少脂肪ARROW類型的腳本的東西嗎？

什麼應該是正確的功能？

來源

2017-09-19 Bharat

[Arrow功能VS函數聲明/表達式可能重複：他們是等價/ exchangeable？]（https://stackoverflow.com/questions/34361379/arrow-function-vs-function-declaration-expressions-are-they-equivalent-exch） – Duncan

每個function都有它自己的this上下文。所以你的this引用函數表達式中的另一個對象。與arrow function它是指外this其中包含arrow function。

使用箭頭語法，並且沒有必要在setInterval後面使用window前綴。

setInterval(() => {   
    stationdate = new Date(stationdate.setSeconds(stationdate.getSeconds() + 1)); 
    this.time = stationdate;    
    }, 1000);

更多閱讀Arrow function vs function declaration/expression - 這是在JavaScript中的主要概念之一。

來源

2017-09-19 14:59:30

我一定會提及它，我不太瞭解TypeS cript箭頭函數.. – Bharat

@Bharat閱讀那麼回答，你會明白 –

在您的兩個功能的組合中，您不使用箭頭功能，這導致this的上下文是window。使用箭頭功能來保持this的外部環境。

window.setInterval(() => {   
    stationdate = new Date(stationdate.setSeconds(stationdate.getSeconds() + 1)); 
    this.time = stationdate;    
}, 1000);

來源

2017-09-19 14:59:51 cyrix

window.setInterval(() => {   
    stationdate = new Date(stationdate.setSeconds(stationdate.getSeconds() + 1)); 
    this.time = stationdate;    
    }, 1000);

在你的代碼，這有錯的情況下。胖箭頭功能是ES6的功能，與TypeScript無關

來源

2017-09-19 15:00:03 alt255

在第二個示例中，this引用的是函數的內部範圍，而不是最可能定義變量的外部範圍。因此，正如其他人所建議的那樣，您需要使用lambda符號。

此外，由於您使用的是AngularJS，所以最好使用$interval而不是window.setInterval()。

請注意，通過使用$interval，$scope.$apply()將被做成髒檢查，如果您的變量已更改，然後更新用戶界面。這在使用window.setInterval()時不是給定的。或者，如果這是您需要的，您仍然可以告知$interval不使用$apply。

來源

2017-09-19 15:05:32

我使用的是Angular 4.3，而且看起來$ interval在4.3中並不好用。 – Bharat

@Bharat，ahh通過使用ES5和標籤'AngularJS'來判斷我認爲你使用的是AngularJS 1.x. –

別擔心，它發生.. – Bharat

它使用回調的常見錯誤。所有在JavaScript中都有自己的'this'上下文（除了箭頭函數）。僅用於系統功能===未定義。

所以正確的方法是使用箭頭函數（如上所示）。最適合現代瀏覽器（或編譯代碼）。

window.setInterval(() => {   
    stationdate = new Date(stationdate.setSeconds(stationdate.getSeconds() + 1)); 
    this.time = stationdate;    
    }, 1000);

另一種方式來存儲 '這個' 被綁定上下文：

window.setInterval((function() {   
    stationdate = new Date(stationdate.setSeconds(stationdate.getSeconds() + 1)); 
    this.time = stationdate;    
    }).bind(this), 1000);

或者更多的解釋：

window.setInterval(
    (function(){console.log(this.hello);}).bind({hello:'hello!'}) 
    , 1000);

來源

2017-09-19 15:11:07

將javascript/Type腳本的2個函數合併爲一個

回答

相關問題