javascript - 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実行されるのですか？setIntervalは1 秒ごとに実行され、他に何も実行できないと想定されていませんか? (上記のコードは書かれた順序で実行されますか?) ありがとうございます。

score 4 · Accepted Answer

コメントは実行順序を示します

(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

これで混乱が解消されることを願っています。

score 3 · Accepted Answer

setTimeout関数（コールバック）を登録するだけでsetIntervalなく、次のコマンドに直接進みます。

そのためHi、Hola最初のコールバックが呼び出される前に出力されます。

最初のコールバックはsetInterval1 秒後のコールバックで、2 秒後のコールバックです。3 秒後setTimeoutにキックインしてクリアしますsetInterval。

score 2 · Accepted Answer

とにかくすべてが実行setTimeout()されます。setInterval()これはsleep()PHP のメソッドではありません... 残念ながら!

ただし、次のリンクが役立つ場合があります: http://www.phpied.com/sleep-in-javascript/

score 2 · Accepted Answer

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

これら 2 つのイベントは非同期です。それらは、「setTimeout」または「setInterval」が呼び出された正確な時間ではなく、次に利用可能な時点でキューに入れられ/実行されます。

javascript - JavaScript setInterval および setTimeout

4 に答える 4

Related

Reference