首页 > 代码库 > JS对异步循环使用递归

JS对异步循环使用递归

场景:有一个函数接收一个URL的数组,要求依次下载每个文件直到所有文件被成功下载。

如果API是同步的,很容易使用一个循环来实现

var downloadAllSync = function(urls) {
    urls.foreach(function(url){
        try{
            return downloadOneSync(url);
        }catch(e) {}
    });
    throw new Error(‘all downloads failed‘);
}

但是用这种方式实现downloadAllAsync并不能正确工作。因为我们不能在回调函数中暂停循环并恢复。它只会启动所有的下载,而不是等待一个完成再试下一个。

var downloadAllAsync = function(urls, callback) {
    urls.foreach(function(url) {
        downloadOneAsync(url, function(error, r) { ... });
        // loop continues
    })
}

解决方案是将循环实现为一个函数tryNextURL,我们可以决定何时开始每次迭代。

var downloadAllAsync = function(urls, callback) {
    var len = urls.length,
        tryNextURL = function(i) {
            // 作为计数器, 最终结果提示不正确的
            if(i >= n) return setTimeout(onerror.bind(null, ‘all downloads failed‘), 0);

            downloadOneAsync(urls[i], function() {
                tryNextURL(i + 1);                  // 在事件循环单独轮次中执行迭代
            })
        };
    tryNextURL(0);          // 开始下载文件
}

参考:编写高质量JS代码68个有效方法