数组和异步函数回调

Question

我有一个异步功能：

var func = function  (arg, next) {
    var milliseconds = 1000;
    setTimeout(function(){
        console.log (arg);
        next()
    }   , milliseconds);
}

和数组：

var arr = new Array();
arr.push (0);
arr.push (1);

console.log(arr);

我想对数组arr每个项目使用func ：

func(arr[0], function(){
    func(arr[1], function(){
        console.log("finish");
    })
})

确定数组由2个元素组成，但是如果我得到1000个元素的数组，如何对arr每个项目使用func ？

如何循环执行？

Answer 1

var arrayFunc = function(array) {
  if (array.length > 0) {
    func(array[0], function() { arrayFunc(array.slice(1)); });
  }
}

这将使用数组中的第一个元素运行您的函数，然后让延续函数使用数组的其余部分。 因此，当它运行时，它将运行数组中的新第一个元素。

编辑：这是一个修改后的版本，不会在周围复制该数组：

var arrayFunc = function(array, index) {
  if (index < array.length) {
    func(array[index], function() {
      var newI = index + 1;
      arrayFunc(array, newI);
    });
  }
}

并以索引0首次调用它。

Answer 2

尽管您的方法有效，但如果调用次数不确定，则无法使用该方法，因为异步命令中的每个链都是硬编码的。

如果要在数组上应用相同的功能，则最好提供一个函数，该函数创建一个内部函数并将超时应用于其内部函数：

var asyncArraySequence = function (array, callback, done){
  var timeout = 1000, sequencer, index = 0;

  // done is optional, but can be used if you want to have something
  // that should be called after everything has been done
  if(done === null || typeof done === "undefined")
    done = function(){}

  // set up the sequencer - it's similar to your `func`
  sequencer = function(){
    if(index === array.length) {
      return done();      
    } else {
      callback(array[index]);
      index = index + 1;
      setTimeout(sequencer, timeout);
    }
  };
  setTimeout(sequencer, timeout);
}

var arr = [1,2,3];
asyncArraySequence(arr, function(val){console.log(val);});

Answer 3

一个简单的异步循环：

function each(arr, iter, callback) {
    var i = 0;
    function step() {
        if (i < arr.length)
            iter(arr[i++], step);
        else if (typeof callback == "function")
            callback();
    }
    step();
}

现在使用

each(arr, func);

Answer 4

您可以尝试arr.map

var func = function  (arg, i) {
    var milliseconds = 1000;
    setTimeout(function(){
        console.log (arg);
    }, milliseconds*i);
}

var arr = new Array();
arr.push (0);
arr.push (1);

arr.map(func);

适用于旧版浏览器的 演示和Polyfill 。

更新：我以为OP希望循环遍历数组并为每个数组项调用回调函数，但我可能是错的，因此与其删除答案，我只是将其保留在此处，也许对其他人有所帮助未来。 这不能回答当前的问题。

Answer 5

一个简单的解决方案是：

var fn = arr.reduceRight(function (a, b) {
  return func.bind(null, b, a);
}, function() {
  console.log('finish');
});

fn();

演示： http ： //jsbin.com/isuwac/2/

---

或者，如果可以更改func的参数顺序以接收next回调作为第一个参数，则它可能很简单：

['a', 'b', 'c'].reduceRight(func.bind.bind(func, null), function (){
  console.log('finish');
})();

演示： http : //jsbin.com/ucUZUBe/1/edit?js，控制台

Answer 6

谢谢，@赫姆斯。 工作解决方案：

var arrayFunc = function(array) {
  if (array.length > 0) {
    func(array[0], function() {arrayFunc(array.slice(1)); });
  }
  else
  {
    console.log("finish");
  }
}
arrayFunc(arr);

Answer 7

您可以遍历数组

for(var i = 0; i < arr.length; i++){
    func(arr[i], function(){...});
}