关于ajax和setTimtout的执行区别

Question

(function () { 
    console.time('ajax');
    console.time('sync');
    console.time('setTimeout');
    
    $.post('../ajax1.php').done(function (data) {
        // ajax后台sleep(2);
        console.timeEnd('ajax');  // 5080.77ms
        console.log(data);
    });
    
    setTimeout(function () { 
           console.log('settimeout');
           console.timeEnd('setTimeout');     // 3090.22ms
    }, 2000);
    
    function sleep(miliSeconds) {
        var data = new Date().getTime();
        var getNowTime = function () {
            return new Date().getTime();
        }
        while ( getNowTime() < (data + miliSeconds) );
    }
    
    // 执行栈延迟3秒后执行
    sleep(3000);
    
    console.timeEnd('sync');  // 3010.58ms
})();

从执行的时间来看，setTimeout和ajax还是有区别的。
我理解中的ajax的回调函数也应该在执行栈（3000mm）后开始执行回调函数(因为ajax后台也是延时2秒)，也就是说ajax的时间也应该是在3000mm左右，然而现实却不是这样，是我理解错了么？请理解的同学帮我指正一下。

update0：我认为setTimeout执行是对的，而上面的ajax执行是有问题的，请大大们指正

update1：我上面的测试是在火狐浏览器运行的，所以返回了错误的结果，在谷歌浏览器下则是正常的。郁闷，森么情况。。

Answer 1

题主，我对你的结果表示怀疑！

下面是我测试的结果：

(1) 首先，我用Node.js写了一个简单的后台，它会延迟2秒返回响应。代码如下：

var http = require('http');
http.createServer(function(req, resp) {
    resp.writeHead(200);
    setTimeout(function() {
        resp.end('Hello!');
    }, 2000);

}).listen(8008);

(2) 为了证明有效，首先在没有堵塞时做如下验证：

console.time('ajax');

$.get('').done(function() {
    console.timeEnd('ajax'); // 打印 ajax: 2026.236ms
});

也就是说延迟为2秒左右。这证明了我写的后台确实使响应延迟了2秒。

另外，有截图为证：

(3) 然后加上堵塞，堵塞时间为3000毫秒：

console.time('ajax');

$.get('').done(function() {
    console.timeEnd('ajax'); // 打印 ajax: 3002.453ms
});

block(3000);

也就是说延迟为3秒左右，而不是你描述的5秒左右。

此处也有截图为证：

(4) 根据以上结果，block并没有堵塞ajax的异步过程，与setTimeout的情况相同。

我不知道你的结果是怎么回事啊。。。

Answer 2

ajax的请求是在sleep执行完后才触发的，再算上"因为ajax后台也是延时2秒"这个时间，确实应该在5s以后。

你的疑惑是“ajax到底是不是在sleep之前触发的，但是callback是在sleep之后触发的”对吧？，答案不是。

Answer 3

虽然js的计时很不靠谱 首先理解第一点 异步的执行都是在同步函数执行后才进行的 从这点来看
3000ms后触发ajax 然后2s延迟 5s返回总共这个没问题
那问题就是 setTimeout是个同步函数，他把函数放到队列里，这个函数在什么时候开始执行呢？或者说计时的0点是setTimeout执行的时候还是所有同步函数执行完的时候呢？
我试了几个数，猜测机理是在同步函数执行完之后，立刻去比对时间看有没有触发，而不是在同步函数执行后才开始计时
也就是说sleep>2000时 取值为sleep的数 <2000时 取大概2000那个数 因为不可能很精确

PS
: 我删掉了http部分 只测试了timeout 所以可能有不准确的地方