這就是Js的事件輪詢啦

stone_fan發表於2019-04-08
JS事件

概述

我們都知道js是單執行緒的，一次只能執行一個任務，但是Js的執行環境(一般是瀏覽器)，維護了一個事件對列。在Js的主執行緒執行的過程中碰到Ajax或setTimeout等非同步操作時，會把它們加入瀏覽器維護的事件佇列，當主執行緒執行完畢之後，會按順序去取事件佇列裡面的任務。

上一張比較搓逼的圖

這就是Js的事件輪詢啦

  • 1.執行主執行緒上面的程式碼
  • 2.碰到Ajax,setTimeout等非同步操作，將非同步操作的回撥函式加入事件佇列
  • 3.當主執行緒空閒依次去執行事件佇列裡面的任務
  • 4.如此往復，重複1，2，3

最後來一個例子啦

  $(function () {

            console.log('----------First----------');

            $.ajax({
                url: 'https://api.apiopen.top/musicBroadcastingDetails?channelname=public_tuijian_spring',
                type: 'GET',
                success: function (str) {
                    console.log('----------Fourth-----------');
                }
            });

            setTimeout(function () {
                console.log('----------Third-----------');

            }, 0);

            console.log('----------Second-----------');

        });
複製程式碼

這就是Js的事件輪詢啦
這裡需要注意的是setTimeout(故意把延時設定為0)的回撥比Ajax的提前加入事件佇列， 例項地址https://github.com/fanxuewen/examples/tree/master/EventLoop

相關文章