js休眠实现sleep[博]

首先js原生并不支持sleep,所有目前的方案都是间接实现的.
需求:

for (i=0;i<100;i++){
    echartsPlots(xxx[i]);
}

其中echartsPlots里面是ajax调用后台,直接执行后台极其容易卡死,里面的数据查询和处理都较慢.所以希望echartsPlots执行后,sleep一段时间,然后继续循环,执行下一个.任务.
方法1,循环实现

function sleep(delay) {
    for (var t = Date.now(); Date.now() - t <= delay;) ;
}

最简单,最坑爹的方法
之所以说坑爹,主要是因为效果上,的确实现了sleep的目的,但实际以牺牲客户端效率的代价,毕竟cpu在空转.
那么,可以达到我期望效果?

for (i=0;i<100;i++){
    echartsPlots(xxx[i]);
    sleep(1000)//毫秒
}

实际是不行(ajax请求都停留在pending状态,实际后端已经返回),原因请自己想下,提示(js本质单线程)

方法2,setTimeout(同setInterval)

function loop(i) {
    console.log(i);
    i++;
    if (i<10)
        setTimeout(function () {
            loop(i);
        }, 2000);
}
loop(0);

这是一种类似递归的实现.效果上达到需求?yes,这个没问题

补充一下,关于setTimeout和setInterval
推荐使用setInterval
参考这篇文章:setInterval()和setTimeout()区别.https://blog.csdn.net/mayue24/article/details/80879685