JS中一种实现sleep函数的方案

困扰了我很久的问题，在此留个记录
①原生js
②setInterval和setTimeout
③近似递归的处理方法

因为js是单线程，所以计时器也是有顺序的

//问题描述：我想实现一个网页的图片左右滑动效果（不是切换），
//要求：每次滑动一张图片，然后停止1s，再滑动……停止……
//解决思路：给图片滑动写一个方法，执行一次移动一小点距离，n次后移动完整张图片，使用setInterval函数去执行这个n次循环的操作；然后使用setTimeout函数去完成1s的等待。
//大概思想代码描述如下：
假设每一张图片宽度值为100
var n = 20;//次数统计
function animation(){
    n--;
    left = left-5;
    if(n == 0){
        n = 20;
        //满足条件就停止播放动画的计时器，从而达到‘阻塞’的效果
        window.clearInterval(timer);
        //设置超时计时器，延时1s执行
        window.setTimeout(function(){
            //清除运行中的计时器（没有则不管）
            window.clearInterval(timer);
            //设置动画的运行的计时器（此时超时计时器已经没有了）
            window.setInterval(animation,20);
        },1000);
    }
}
var timer = window.setInterval(animation,20);
//效果就是每20ms执行一次图片操作，执行20次之后就等待1000ms，不会因为js暂停之类的系统优化策略导致滑动位置错误
//延时操作是为了开启动画计时器

还有一种死循环写法（参考自网络）
思路是利用系统时间，一旦没有运行到自己设定的时间就让程序一直在循环里计算（个人感觉实现简单，实际运行可能有点恐怖）

function sleep(numberMillis) { 
    //记录当前时间
    var now = new Date(); 
    //设置未来的某个时间
    var exitTime = now.getTime() + numberMillis; 
    while (true) { 
        //获取当前时间
        now = new Date(); 
        //检查是否到了设置好的未来时间
        if (now.getTime() > exitTime) 
        return; 
    } 
}