javascript - javascript setTimeout が一度に実行されるのはなぜですか?

Question

このコードを取得しましたが、ループ内のすべての関数が一度に呼び出される理由がわかりません!

this.line = function($l) {
    var $this = this;
    $this.$len = 0;
    $('.active').hide(0,function(){             
        $this.$len = $l.length;
        var j = 1;
        $.each($l,function(i,item){
            var t = setTimeout(function(){
                $this._echoLine($l[i]);
                clearTimeout(t);
                if (j >= $this.$len) $('.active').show();
                j++;
            },500*j);
        });
    });
}

Answer 1

j これは、タイムアウト関数内でのみインクリメントするためですが、(依存するj) 遅延は1、タイムアウト ハンドラが登録された時点のままです。

とにかくループインデックス変数があるので（i）、これを試してください：

$l.each(function(i, item) {
    setTimeout(function() {
        $this._echoLine($l[i]);
    }, 500 * (i + 1));
});

// a separate timeout to fire after all the other ones
setTimeout(function() {
    $('.active').show();
}, ($l.length + 1) * 500);

行は必要clearTimeoutないので、宣言も保存も必要ありませんt。

Answer 2

それがうまくいくことを願っています。

this.line = function($l) {
    var $this = this;
    $this.$len = 0;
    $('.active').hide(0,function(){             
        $this.$len = $l.length;
        var j = 1;
        $.each($l,function(i,item){
            var t = setTimeout(function(){
                $this._echoLine($l[i]);
                clearTimeout(t);
                if (j >= $this.$len) $('.active').show();
                j++;
            });
        });
    });
}

setTimeout(function() { this.line(); }, 500);