时间戳

首页 > 解决方案 > 带有setTimeout的for循环？

javascript - 带有setTimeout的for循环？

问题描述

我有一个函数可以从对象中显示所有内容。

queries = {
  "info": {
    "query": "SELECT ...",
    "id": "10"
  },
  "info2": {
    "query": "INSERT ...",
    "id": "12"
  },
  "infoN": {
    "query": "DELETE ...",
    "id": "123"
  }
}

for (var [key, value] of Object.entries(queries)) {
    let name = key;
    let query = value.query;
    let id = value.id;

    console.log(name);
    console.log(query);
    console.log(id); 
    //setTimeout(function() { }, 3000);
}

但我需要显示第一个对象，然后在 3 秒后显示另一个对象，依此类推。如何使用 setTimeout 循环它们？或者类似的东西？

标签： javascriptsettimeout

解决方案

最简单的方法是在每次调用 setTimeout 时使用不同的延迟

let counter = 1
for (...){
    setTimeout(function() { }, 3000 * counter++);
}

由于 Object.entries 返回一个数组，我们也可以使用 Array.entries 在 for 语句中获取迭代计数器。 

queries = {
  "info": {
    "query": "SELECT ..."
  },
  "info2": {
    "query": "INSERT ..."
  },
  "infoN": {
    "query": "DELETE ..."
  }
}

for (let [counter, [key, value]] of Object.entries(queries).entries()) {
  const delay = (counter + 1) * 1000
  setTimeout(() => {
    console.log({
      counter,
      delay,
      key,
      value
    })
  }, delay)
}

虽然我认为counter直接设置同样容易阅读。

推荐阅读