JavaScript setInterval和setTimeout

Question

下一個代碼每隔1秒顯示一次日期，然後停止。

(function() { 
    var i = setInterval(function() { 
     console.log(new Date()); 
    }, 1000); 
    console.log("Hi"); 

    setTimeout(function() { 
     clearInterval(i); 
    }, 3000); 
    console.log("Hola"); 
})(); 

輸出：

Hi 
Hola 
Wed Oct 24 2012 13:35:27 GMT+0200 (CEST) 
Wed Oct 24 2012 13:35:28 GMT+0200 (CEST) 
Wed Oct 24 2012 13:35:29 GMT+0200 (CEST) 

但我不知道爲什麼Hi和Hola首先顯示。另外，爲什麼setTimeout被執行？不應該假設每1秒執行一次setInterval，其他任何事情都不能執行？ （上面的代碼是按照寫入順序運行的嗎？） 謝謝。

Answer 1

setTimeout以及setInterval只能註冊功能（回調），但隨後直奔下一個命令。

因此，Hi和Hola在第一個回調被調用之前被打印。

第一個回調將是1秒後setInterval的回調，然後是2秒後再回調。3秒後setTimeout開始並清除setInterval。

Answer 2

無論如何，一切都出setTimeout()和setInterval()被執行。 這不是PHP的方法sleep() ......不幸的是！

然而，這個環節可能是有用的：http://www.phpied.com/sleep-in-javascript/

Answer 3

http://ejohn.org/blog/how-javascript-timers-work/

這兩個事件是異步的。它們在下一個可用時刻排隊/執行，而不是在確切的時間調用「setTimeout」或「setInterval」。

Answer 4

中的註釋說明的執行順序

(function() {       // 0 anonymous function is called inline 

    var i = setInterval(function() { // 1 setInterval **schedules** the function 
             //  parameter to be executed every second 
     console.log(new Date()); 
    }, 1000); 
    console.log("Hi");     // 2 Display 'Hi' on console 

    setTimeout(function() {    // 3 **Schedule** the function parameter to 
             //  execute after three seconds 
     clearInterval(i);  
    }, 3000); 
    console.log("Hola");    // 4 Display 'Hola' on console 
})(); 

             // 5 Display date from setInterval function 

             // 6 Display date from setInterval function 

             // 7 Display date from setInterval function 

             // 8 Cancel setInterval executed from 
             //  setTimeout function 

希望這清除了你的困惑。