Question

这里有些问题;

我有一个HTTP GET调用，每3秒运行一次。调用的响应数据是一个对象数组，我想将它们记录到控制台。

如何避免间隔之间的碰撞？

一个例子：

    setInterval(function(){
        $http.get('/some/api').then(function(dataArray){
            dataArray.forEach(function(element){
                  setInterval(function(){
                      console.log(element);
                  },1000)
            });
        })
    },5000)

假设来自api的数组在第一次是[1,2,3]，第二次是[4,5,6]，我需要看到： 1 2 3 4 五 6

由于

Answer 1

将setTimout()替换为setInterval();将index .forEach()回调函数乘以duration 1000

＆＃13;

var dataArray = [1, 2, 3];
dataArray.forEach(function(element, index) {
  setTimeout(function() {
    console.log(element);
  }, 1000 * index)
});

＆＃13;

您也可以在每次成功回复时致电clearInterval()，使用Promise.all()，Promise()构造函数，将.map()替换为.forEach()，然后致电setInterval在.then()构造函数中完成所有Promise.all()次调用后，setTimeout()链接到Promise()

function delay() {
  return $http.get('/some/api').then(function(dataArray) {
    clearInterval(interval);
    return Promise.all(dataArray.map(function(element, index) {
        return new Promise(function(resolve) {
          setTimeout(function() {
            console.log(element);
            resolve();
          }, 1000);
        });
      }))
      .then(function() {
        interval = setInterval(delay, 5000)
      });
  })
}

interval = setInterval(delay, 5000);

＆＃13;

function get() {
  return new Promise(function(resolve) {
    resolve(Array.from(Array(Math.floor(Math.random() * 10)).keys()))
  })
}

function delay() {
  return get().then(function(dataArray) {
    clearInterval(interval);
    console.log("current `dataArray.length`:", dataArray.length);
    return Promise.all(dataArray.map(function(element, index) {
        return new Promise(function(resolve) {
          setTimeout(function() {
            console.log(element);
            resolve()
          }, 1000 * index)
        })
      }))
      .then(function() {
        interval = setInterval(delay, 5000)
      });
  })
}

interval = setInterval(delay, 5000)

＆＃13;

Answer 2

我希望摆脱这种嵌套的时间间隔，我能想到的其他方法是让array从每个$http.get('/some/api')调用中将数据添加到其中，我会有另一个这个区间之外的函数纯粹适用于array变量。为了清楚起见，请看这个样本。

var valuesToLog =[];  // holds the elements 

setInterval(function(){
  $http.get('/some/api').then(function(dataArray){
      valuesToLog.push(dataArray);  //keep adding into the array for logging
  })
},5000)

//new player which runs every second.
setInterval(funcion(){
   if(valuesToLog.length){
     console.log(valuesToLog[0]); //log first item
     valuesToLog.splice(0,1) // and remove the logged item. ie: first item
   }
},1000);

所以每一秒我都会记录数组中的第一个项目并将其删除..此外，由于间隔永远不会被杀死，它会每秒检查一次数组，如果项目存在则会记录..

希望这有用。

在Javascript

2 个答案: