setTimeout(f,0)的作用及使用場景

介紹下setTimeout(0)的作用及簡單應用場景

# 作用簡述

setTimeout(f,0)的作用很簡單，就是為了把f放到運行隊列的最后去執行。

就是說，無論setTimeout(f,0)寫在哪，都可以保證在隊列的最后執行，因為它是異步操作。

js主線程會優先完成同步任務，在同步任務執行過程中，不會執行其它任務,setTimeout的定時到了執行時間，JS主線程仍然還在執行同步任務，setTimeout所指定的方法并不會立刻執行,當js主線程空閑，異步任務隊列中只有setTimeout執行的方法時,才會繼續執行setTimeout里的function。

setTimeout(f,0)做的事情：在指定delay約0秒后，將指定方法f作為異步任務添加到異步任務隊列中。

為啥是異步操作?

通過chrome瀏覽器架構學習一文我們知道setTimeout是由定時觸發器線程來控制的，另起了一個線程，所以是異步操作。

計時精度

setTimeout第二個參數為0表示立即執行(實際上有一定延遲,視瀏覽器計時精度而定)。

??

計時精度如下：

IE8及更早版本的計時器精度為15.625ms

IE9及更晚版本的計時器精度為4ms

Firefox和Safari的計時器精度大約為10ms

Chrome的計時器精度為4ms

當使用這個方法的時候，瀏覽器會另起一個線程，來執行setTimeout里面的函數，而原有的線程繼續執行。

至于與setTimeout后繼的同步函數的執行順序或者執行快慢，并沒有固定的答案，視瀏覽器而定了。

# 簡單應用場景

監控input或者textarea中文本的變化

當使用鼠標右鍵操作進行粘貼或剪切時，控制臺輸入的文本內容是操作前的舊內容。為了獲取操作后的新文本內容，可以將對文本的獲取和處理放在setTimeout中延時執行

// 響應鍵盤輸入，粘貼和剪切事件

$('#input').on('keyup paste cut', function() {

var $this = $(this);

setTimeout(function(){ // 使鼠標粘貼和剪切時，輸入框內內容為最新

console.log($this.val());

}, 0)

});

setTimeout能夠影響代碼的執行順序和時機,合理使用能夠讓更重要的代碼優先執行,fix特定場景下奇怪的bug等等。

版權聲明：本文內容由網絡用戶投稿，版權歸原作者所有，本站不擁有其著作權，亦不承擔相應法律責任。如果您發現本站中有涉嫌抄襲或描述失實的內容，請聯系我們jiasou666@gmail.com 處理，核實后本網站將在24小時內刪除侵權內容。

版權聲明：本文內容由網絡用戶投稿，版權歸原作者所有，本站不擁有其著作權，亦不承擔相應法律責任。如果您發現本站中有涉嫌抄襲或描述失實的內容，請聯系我們jiasou666@gmail.com 處理，核實后本網站將在24小時內刪除侵權內容。