以设定的时间增量循环对象答案

【问题标题】：Loop over an object at set increments of time以设定的时间增量循环对象
【发布时间】：2019-11-30 19:34:05
【问题描述】：

我一直在寻找这个问题的答案，但我发现的修复并没有帮助，所以我想我会直接指出我哪里出错了（像往常一样 - 非常感谢这里的任何帮助）

所以我有一个包含评论的对象数组，我需要它每 10 秒在网站上发布一条新评论，即更新文本等：

我想我会使用：

review = [{
name: 'X',
rating: 'X',
review: 'X'
},

{
name: 'X',
rating: 'X',
review: 'X'
}]

然后使用 setTimeout 函数和 for 循环更新站点的 html（显然这不像我想象的那么容易） -

function init(){

    var name = document.querySelector('.name');

    for(i=0; i<reviews.length; i++){
        setTimeout(function(){
            name.innerHTML = reviews[i].aditional_info_name;
        },10000)
    }

}

这里的任何输入都会有帮助 - 我已经看到了关于这个主题的其他一些帖子，但我还没有根据我迄今为止所看到的内容来实现一个修复。

问题 -

我不断得到：

提前致谢， W

【问题讨论】：

你检查过类型评论和评论吗？

标签： javascript for-loop settimeout

【解决方案1】：

let reviews = [{
    name: 'X',
    rating: 'X',
    review: 'OX'
  },

  {
    name: 'X',
    rating: 'X',
    review: 'XL'
  },

  {
    name: 'X',
    rating: 'X',
    review: 'XD'
  },

  {
    name: 'X',
    rating: 'X',
    review: 'XJ'
  },

  {
    name: 'X',
    rating: 'X',
    review: 'HX'
  },

  {
    name: 'X',
    rating: 'X',
    review: 'XG'
  }
]


function init() {

  var name = document.querySelector('.name');

  for (var i = 0; i < reviews.length; i++) {
    (function(index) {
      setTimeout(function() {
        name.innerHTML = reviews[index].review;
      }, index * 1000)
    })(i);
  }

}

init();

<div class="name">

</div>

您应该使用let 或使用closure。因为在您设置的超时被执行时，循环的最后一个变量是剩下的。还要检查变量名称，您提到的评论不是评论

function init(){

    var name = document.querySelector('.name');

    for(let i=0; i<reviews.length; i++){
        setTimeout(function(){
            name.innerHTML = reviews[i].aditional_info_name;
        },i*10000)
    }

}

或

function init(){

        var name = document.querySelector('.name');

        for(var i=0; i<reviews.length; i++){
           (function(index) {
            setTimeout(function(){
                name.innerHTML = reviews[index].aditional_info_name;
            },index*10000)
            })(i);
        }

    }

另见this

【讨论】：

感谢您的回复 - 这确实有效，但不是以预期的方式。这会等待 10 秒，然后一次发布所有项目 - 我想要做的是，在第一次更新后等待 10 秒，在第二次更新后等待 10 秒等，直到完成。关于如何做到这一点的任何想法都会很棒
已更新请查看@Wally。我也做了一个sn-p。
很棒的东西老兄——对我的实际代码名称的结构进行了非常小的改动。innerHTML = reviews[i].aditional_info_name; - 但我认为这是 100% 我没有很好地解释它。再次感谢您的帮助（现在来研究这一切的 WHYZZZ）

【解决方案2】：

尝试将function() { 替换为() => {。

【讨论】：