成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

從settimeout看javascript的運行機制

JerryC / 1258人閱讀

摘要:前言我們知道是一個單線程的語言,而且其運行機制比較特殊。即異步任務(wù)一定在同步任務(wù)之后執(zhí)行。理解了閉包的同學(xué)一定可以理解這一點。

前言

我們知道JS是一個單線程的語言,而且其運行機制比較特殊。
下面我們通過settimeout的幾個示例來展現(xiàn)javascript的運行機制的特殊點

示例1
console.log(1);
setTimeout(function(){
    console.log(2);
},0);
console.log(3);
// 打印出 1 3 2
示例2
console.log("1");
setTimeout(function(){
    console.log("2");
},0);
while(1){}
// 打印出1,然后瀏覽器卡死,不會打印出2

javascript會先把需要運行的內(nèi)容放到任務(wù)隊列中
但是如果遇到settimeout,會認為這是個異步任務(wù),會先放到異步隊列中
瀏覽器會先執(zhí)行同步任務(wù),等到同步任務(wù)執(zhí)行完之后,再查看異步隊列
如果異步隊列中的任務(wù)的執(zhí)行時機到了,瀏覽器就會把任務(wù)放到同步隊列中去。

即:
異步任務(wù)一定在同步任務(wù)之后執(zhí)行。

示例3
for(var i = 0; i < 4; i++){
    setTimeout(function() {
        console.log(i);
    }, 1000);
}
// 打印 4 4 4 4

為什么打印出的是4 4 4 4呢?
因為瀏覽器會先執(zhí)行for循環(huán)
每執(zhí)行一次for循環(huán),都把一個settimeout壓入異步隊列
1000毫秒之后,執(zhí)行settimeout里的方法的時候,i的值已經(jīng)是4了。

如果要打印0 1 2 3怎么辦呢?
利用閉包的特性,把i緩存到一個temp值里

for(var i = 0; i < 4; i++){
    (function(temp){
        setTimeout(function() {
            console.log(temp);
        }, 1000);
    })(i);
}
// 打印 0 1 2 3

這樣做等于是每一次for循環(huán)都新建了一個匿名函數(shù),i的值被存入了這個匿名函數(shù)的內(nèi)存里。
理解了閉包的同學(xué)一定可以理解這一點。

示例4

我們知道ES6引入了新的關(guān)鍵字let
在這里,let有一個新的特性

for(let i = 0; i < 4; i ++){
    setTimeout(function(){
        console.log(i); 
    }, 1000);
}
// 打印 0 1 2 3

示例4與示例3只有var和let這個地方有區(qū)別,但是打印出來的結(jié)果卻完全不同
這是因為let是一個塊級作用域
let定義的i,對于每一個for循環(huán)的執(zhí)行來說都是一個全新的i(使用不同的內(nèi)存地址)
所以打印的時候可以得到0 1 2 3

文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址:http://systransis.cn/yun/110225.html

相關(guān)文章

  • setTimeout-setIntervalJS線程

    摘要:提出標準,允許腳本創(chuàng)建多個線程,但是子線程完全受主線程控制,且不得操作。所以,這個新標準并沒有改變單線程的本質(zhì)。事件循環(huán)主線程線程只會做一件事,就是從消息隊列里面取消息執(zhí)行消息,再取消息再執(zhí)行。工作線程是生產(chǎn)者,主線程是消費者。 最近項目中遇到了一個場景,其實很常見,就是定時獲取接口刷新數(shù)據(jù)。那么問題來了,假設(shè)我設(shè)置的定時時間為1s,而數(shù)據(jù)接口返回大于1s,應(yīng)該用同步阻塞還是異步?我們...

    elliott_hu 評論0 收藏0
  • 深入淺出JavaScript運行機制

    摘要:主線程從任務(wù)隊列中讀取事件,這個過程是循環(huán)不斷的,所以整個的這種運行機制又稱為事件循環(huán)。上面也提到,在到達指定時間時,定時器就會將相應(yīng)回調(diào)函數(shù)插入任務(wù)隊列尾部。這就是定時器功能。關(guān)于定時器的重要補充定時器包括與兩個方法。 一、引子 本文介紹JavaScript運行機制,這一部分比較抽象,我們先從一道面試題入手: console.log(1); setTimeout(function()...

    mochixuan 評論0 收藏0
  • 深入淺出JavaScript運行機制

    摘要:主線程從任務(wù)隊列中讀取事件,這個過程是循環(huán)不斷的,所以整個的這種運行機制又稱為事件循環(huán)。上面也提到,在到達指定時間時,定時器就會將相應(yīng)回調(diào)函數(shù)插入任務(wù)隊列尾部。這就是定時器功能。關(guān)于定時器的重要補充定時器包括與兩個方法。 一、引子 本文介紹JavaScript運行機制,這一部分比較抽象,我們先從一道面試題入手: console.log(1); setTimeout(function()...

    魏明 評論0 收藏0
  • 深入淺出JavaScript運行機制

    摘要:主線程從任務(wù)隊列中讀取事件,這個過程是循環(huán)不斷的,所以整個的這種運行機制又稱為事件循環(huán)。上面也提到,在到達指定時間時,定時器就會將相應(yīng)回調(diào)函數(shù)插入任務(wù)隊列尾部。這就是定時器功能。關(guān)于定時器的重要補充定時器包括與兩個方法。 一、引子 本文介紹JavaScript運行機制,這一部分比較抽象,我們先從一道面試題入手: console.log(1); setTimeout(function()...

    chaosx110 評論0 收藏0

發(fā)表評論

0條評論

最新活動
閱讀需要支付1元查看
<