Javascript 每隔'；执行一个.map（）函数；x'；秒数

我有一个功能：

function getPattern (sequence) {
  sequence.map(pod => pod.classList.add('playing'))
  // rest of code
}

我将如何每隔2秒执行

pod.classList.add（'playing'）

？此外，我希望保持此同步，以确保在所有

pod

迭代完成后运行

//代码的其余部分

（对于那些好奇的人来说，sequence只是一个HTML节点数组）

编辑我尝试过的内容：

sequence.forEach(pod => setTimeout(() => { pod.classList.add('playing') }, 2000))
sequence.map(pod => setTimeout(() => { pod.classList.add('playing') }, 2000))

setTimeout(() => {
 sequence.map(pod => pod.classList.add('playing'))
}, 2000)
setInterval(() => {
 sequence.map(pod => pod.classList.add('playing'))
}, 2000)

但是，我遇到了我想在问题中避免的两个问题：
addClass
没有延迟；所有迭代“同时”执行。此外，
//代码的其余部分
正在异步运行（也就是说，我注意到
console.log
）
您不能简单地暂停脚本的执行，使用
setTimeout
/
setInterval
是您唯一的选择。
但是，由于所有的
setTimeout
调用都是在同一时间执行的，因此您要么嵌套它们，要么通过增加超时（2s、4s、6s，…）来调用它们。
后者可以通过调用以下命令来实现：

`sequence.forEach((pod, i) => setTimeout(() => { pod.classList.add('playing') }, (i + 1) * 2000))`

要在最后一次回调完成后执行脚本的其余部分，必须将其包装在另一个
setTimeout
回调中，延迟
sequence.length*2000
（或
（sequence.length+1）*2000
，具体取决于您的需要）.
您可以使用
Promise
s将类添加到每个节点，并在处理完所有节点后运行代码


var myArrayOfDomNodes=Array.from（document.querySelectorAll（'p'）；
依次添加类（myArrayOfDomNodes）{
//此代码将在添加所有类后运行。
console.log（“全部完成”）；
});
函数addClassAfterwoSeconds（el）{
返回新承诺（res=>{
setTimeout（U8;=>{
el.classList.add（'playing'）；
res（）；
}, 2000);
});
}
函数依次添加类（顺序）{
让item=sequence.shift（）；
return item？addClassAfterwoSeconds（item）.then（addClasseSequentialy.bind（null，sequence））：Promise.resolve（）；
}
p.playing{
颜色：红色；
}
一个

两个

三

四个
setInterval（函数（）{getPattern（）；}，1000）；//每1秒
？这不是
map
的工作方式<代码>映射

返回一个新数组。您可能需要正式注明的

forEach

。但仍然存在同样的问题（如编辑中所示）@是否要设置一个项目的类，然后等待将该类添加到下一个项目？还是每次都要遍历整个数组？不管您在做什么，setTimeout可能是一种解决方法。如果添加了pod，只需将它们传递给添加类的函数即可。顺便说一句，您的代码正在完全运行，这是一个很好的答案。然而，我只是在努力理解三元运算符。物品是如何变成虚假的，从而产生一个明确的承诺的？@JamesBarrett，它从来不是真正的

虚假的
，只是“虚假的”。在最后一个递归中，
sequence
将是一个空数组，因此
sequence.shift（）
将生成
未定义的值
undefined
将触发三元组的假路径，因为
undefined
强制执行
false
（即
Boolean（undefined）==false
）