読者です 読者をやめる 読者になる 読者になる

ジンジャー研究室

長めのつぶやき。難しいことは書きません。

非同期処理の完了を待って次のコードに移る

いつ終わるか分からん非同期処理

どうしても逐次実行したいんだYo!
というわけで、強引に逐次実行するメソッドを作ってみた(荒削り)

var sequence = function(functions){
    var _setTimeout = setTimeout;
    var asyncCount = 0;
    var next = function(){};
    window.setTimeout = function(f, time){
        asyncCount++;
        _setTimeout(function(){
            f();
            asyncCount--;
            if(asyncCount <= 0){
                asyncCount = 0;
                next();
            }
        }, time);
    };
    var fs = functions.reduceRight(function(memo, f){
        return function(){
            next = memo;
            f();
            if(asyncCount <= 0){
                asyncCount = 0;
                next();
            }
        }
    }, function(){
        window.setTimeout = _setTimeout;
    });
    fs();
}

// usage
sequence([function(){
    console.log('a');
}, function(){
    setTimeout(function(){
        console.log('b');
    }, 300)
}, function(){
    setTimeout(function(){
        setTimeout(function(){
            console.log('c2');
        }, 1000);
        setTimeout(function(){
            console.log('c1');
        }, 500);
    }, 500);
}, function(){
    console.log('d');
}]);

デモ(コンソールを見てください)

これを全ての非同期処理に埋め込めば完成…するのではなかろうか。