javascript - 异步给出回调已经调用错误？

Question

我正在尝试实现以下场景。但是在执行时我收到错误未捕获错误:回调已被调用。

有人能发现我做错了什么吗？

async.forEachOf(code,function(item, index, done){
    var currentItemId = item.id;    
    var subitemCount = item.subitem;
    for(var k=0; k< subitemCount ; k++){
         $.ajax({
            url: 'api/item' + k,
            success: function(result) {              
             code["allSub"].push(result);
             done();
            },
            error: function(err) {                
                done(err);             
            }
        })
    }
},function(){
    console.log(code);
});

Answer 1

问题在于for(var k=0; k< subitemCount ; k++){声明。

请注意，对于每个 item.subitem您正在进行一个 ajax 调用。在每个调用返回后，您将调用 done()打回来。因此，代码实际上多次调用回调(即 done() )。每个 ajax 调用一次，因此每个 item.subitem 一次.

这就是为什么您会遇到 Uncaught Error :回调已被调用。

为了避免这种情况，您需要再制作一个 async.forEachOf而不是

尝试使用这个:

async.forEachOf(code,function(item, index, doneItem){
    var currentItemId = item.id;    
    var subitemCount = item.subitem;
    async.forEachOf(subitemCount, function (subItem, subItemIndex, subItemDone){
        $.ajax({
            url: 'api/item' + subItemIndex,
            success: function(result) {              
                code["allSub"].push(result);
                subItemDone();
            },
            error: function(err) {                
                subItemDone(err);             
            }
        })
    }, function(err) {
        //Called once all the current item's subItems ajax calls were finished 
        doneItem(err);
    }


},function(){
    //Called once all items in "code" finished their own subItem ajax calls
    console.log(code);
});

如果item.subitem是数值而不是数组，您可以尝试使用 async.times

async.forEachOf(code,function(item, index, doneItem){
    var currentItemId = item.id;    
    var subitemCount = item.subitem;
    async.times(subitemCount, function (subItemIndex, subItemDone){
        $.ajax({
            url: 'api/item' + subItemIndex,
            success: function(result) {     
                code["allSub"].push(results);         
                subItemDone();
            },
            error: function(err) {                
                subItemDone(err);             
            }
        })
    }, function(err, results) {
        //Called once all subItem ajax calls were finished
        doneItem(err);
    }


},function(){
    //Called once all items in "code" finished their own subItem ajax calls
    console.log(code);
});