setTimeout ,xhr,event 线程问题

阅读更多

由   http://lifesinger.org/blog/?p=1568    所想

 

1. javascript 是单线程的，其实只有 xhr是新开了一个线程而已。

 

第一段代码：

 

setTimeout(function () {
    alert(1);
},
0);
setTimeout(function () {
    alert(2);
},
0);
Ext.ajax.request({
    url: 'xx.不存在',
    failture: function () {
        alert(3);
    }
});

 

alert : 会阻塞当前线程

 

则会先弹出1(不要点确定)，等会弹出3，而2只有点击 1,3 都确定后才会弹出

 

第二段代码：

 

setTimeout(function () {
    for (var i = 0; i < 2000; i++)
    console.log('  main thread  ' + i);
},
0);
setTimeout(function () {
    for (var i = 0; i < 1000; i++)
    console.log('  main thread-2  ' + i);
},
0);
Ext.ajax.request({
    url: 'xx.不存在',
    failture: function () {
        alert(3);
        for (var i = 0; i < 100; i++)
        console.log('  sub thread  ' + i);
        alert(4);
    }
});

 

则会 先打印main thread 0,main thread 1,.... 还没到 main thread 1999 时 就 alert(3) ,点确认后 alert(4) , 注意其间 main thread 打印 一直没停， 一直 到 main thread 1999 , 然后 main thread-2 0 main thread-2 1 一直到 main thread-2 999 ,然后 才是 sub thread 0 ....sub thread 99 ,可见只有 ajax 的回调 alert  先弹出了 (与alert 顺序无关)，他后面的操作 放在 javascript单线程事件 队列里面

------------------------------------------总结一下

可能不太对， 第二段代码 在 ff 中表现如上，在ie 中 装了 Companion.JS,但是不太准确（打印了3000个log后才弹出alert(3)）

故：看见 alert 操作很特殊 可能与事件队列无关，ajax 是新开一个线程 ，返回时，处理函数放在javascript 事件队列的末尾，但里面的 alert 不管顺序挨各先执行.(对应第二段代码)

ajax 回调的alert 可插在 原先的 alert 后面 ，而 原先alert后面的alert 则要等 ajax 回调的alert 点击确定后才能执行。 (对应第一段代码)

 

2.ie element 的事件添加为 栈 先进后出，其他浏览器为 队列 后进后出，不过 setTimeout  都一样的，把定时运行函数放在当前所有操作的最后处理。

 

测试代码：

 

 

 

• singleThread.zip (36.9 KB)
• 下载次数: 25

• 
• 大小: 328.2 KB

• 查看图片附件