循环setTimeout最后一个元素的问题

Question

我想循环一个定时器 从0到9,但是再次调用的时候9却和0同时出现我想知道怎么解决

function move(){
        for (var i = 0; i < 10; i++) {
            setTimeout(function(i){
                console.log(i);
                if (i == 9) {
                    i = 0;
                    move()
                }
            },i*1000,i)
        }
    };
    move();

Answer 1

如果是 for 内使用 setTimeout 太浪费内存了。

我秀一个闭包的写法：

var move = function() {
    var digit, COUNT;

    function show() {
        console.log(digit);
        setTimeout(function() {
            ++digit;
            digit = digit >= COUNT ? 0 : digit;
            show();
        }, 1000);
    }
    return function(count) {
        COUNT = count;
        digit = 0;
        show();
    }
}()
move(10);

Answer 2

    function move(){
        for (var i = 0; i < 10; i++) {
            setTimeout(function(i){
                console.log(i);
                if(i==9){
                    setTimeout(function(){
                        move()
                    },1000)
                }
            },i*1000,i)
        }
    };
    move();

Answer 3

function move(){
        for (var i = 0; i < 10; i++) {
            setTimeout(function(i){
                console.log(i);
                if (i == 9) {
                    i = 0;
                    move();
                }
            },(i + 1) *1000,i); // 调个 时间 实参 就好 了~~~
        }
    };
    move();

Answer 4

你的i==9时，i=0归0了- -后面的时间i*1000直接变成0了 所以9和0一起出来了

上面的修改方法我就不说了- -还可以换个写法：

<p id="show-time"></p>

    var clock = 0,
        t;

    function time() {
        document.getElementById('show-time').innerText = clock;
        if (clock < 9) {
            clock++;
        } else if (clock === 9) {
            clock = 0;
        }
        t = setTimeout(arguments.callee, 1000);
    }
    time();