淺談JavaScript逾時調用和間歇調用_javascript技巧

來源:互聯網
上載者:User

間歇調用

在JavaScript中間歇調用很常見,setInterval,就是間隔一定的時間重複調用。

setInterval()方法接收兩個參數:第一個參數可以是字串,也可以是函數,第二個參數是一個以毫秒為單位的數字,表示重複間隔的時間長度。

參數是字串

當第一個傳遞參數是字串時,如下:

setInterval("alert('this is a string.')",1000);

這裡的字串是一段JavaScript代碼,和傳入的eval()函數的參數一樣,如果是有內外兩個引號的話,記得引號不要相同就行了。

setInterval()會返回一個數值型的ID,這個ID是計劃執行代碼的唯一識別碼,所以可以用它來取消重複操作。setInterval()對應的一個取消該操作的方法:clearInterval(),當然要取消重複操作的話,clearInterval()必須放在還沒有執行完畢的時候。

比如:

var intervalId=setInterval(...);clearInterval(intervalId);

首先我們擷取ID,然後將ID傳入clearInterval()中即可,因為取消操作緊跟在setInterval()後面,所以可以立即取消,就和沒發生一樣。

參數是函數

因為當傳遞的參數是字串的時候,可能會導致效能損失,所以一般情況下,用的最多的還是給它傳遞一個函數。

如下:

var num=0;function increNum(){ num++; if(num>=10){  clearInterval(intervalId);  alert('over'); }}intervalId=setInterval(increNum,500);

該段程式設定了一個increNum函數,並作為參數傳遞給setInterval(),同時當重複運行到10次的時候,取消運行操作,彈出警告框。

逾時調用

逾時調用和間歇調用類似,setTimeout(),它也接收兩個參數,第一個可以是包含JavaScript代碼的字串,也可是一個函數,第二個參數是延時時間和setInterval()方法的參數是一樣。

但是這裡要說明一點:

延時時間並不是說經過設定的延時後程式一定會執行。

為什麼呢?

因為JavaScript是單線程解譯器,所以在一定的時間內只能執行一段代碼,不能同時執行多段代碼,所以在JavaScript中有一個任務隊列,將要執行的任務按照先後順序排在隊列中,設定的延時時間是經過這段時間將當前任務加入到任務隊列中。如果當前沒有任務執行,那麼加入到任務隊列中的代碼立刻執行,如果當前還有正在執行的程式碼片段,那麼只有當該程式碼片段執行完畢後再執行新加入的任務。

同樣,setTimeout()也有一個返回ID,也可以通過這個數值ID來取消逾時調用,對應的取消方法是clearTimeout()。

在這裡,我們用逾時調用方法來把間歇調用中的那段重複執行的代碼複寫一遍:

var num=0;function increNum(){ num++; if(num<=10){  setTimeout(increNum,500); }else{  alert('over'); }}setTimeout(increNum,500);

這段程式也可以完成重複操作並在10次之後終止操作,和上述的setInterval()有區別的是它並沒有用返回的數值ID。

因為setInterval()是重複執行,所以一直會有數值ID返回,所以必須得一直跟蹤這個數值ID,而setTimeout()執行完畢後就不再執行,所以我們不用跟蹤這個返回的數值ID,這就給我們帶來了一定的便利。

而且,後一個間歇調用可能會在前一個間歇調用還沒結束之前被調用,當函數的執行時間比間歇調用的時間長的時候這種情況就會發生,所以綜上所述,用setTimeout()來類比間歇調用是一種比較好的途徑。

當然,在比較簡單的程式中用setInterval()還是沒有很大問題的(突然想起了一句話,存在即是合理的~~~~)。

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.