Javascript 向for循环添加超时

我正在尝试向for循环添加超时延迟。它当前循环变量中的位置，并为其中的所有位置放置一个标记。它工作的很好，但我想它显示他们有轻微的时间延迟。我试图使用setTimeOut函数，但当我添加它时，它无法加载数据

在我添加超时之前循环正在工作

 for (var i = 0; i < data.length; i++) {
        if (data[i].lat != null) {
        markers[data[i].username]= new L.marker([data[i].lat, data[i].lng], { bounceOnAdd: true,draggable: true, icon: redIcon });
        map.addLayer(markers[data[i].username]);
        markers[data[i].username].bindPopup('Online :' + data[i].username);
      }

for（变量i=0；i

以及添加超时后不起作用的内容

 for (var i = 0; i < data.length; i++) { setTimeout(function () {
        if (data[i].lat != null) {
        markers[data[i].username]= new L.marker([data[i].lat, data[i].lng], { bounceOnAdd: true,draggable: true, icon: redIcon });
        map.addLayer(markers[data[i].username]);
        markers[data[i].username].bindPopup('Online :' + data[i].username);
      }, 3000); 
      } 

for（var i=0；i

不要使用循环，而是使用带有

setTimeout

的函数。它使用第一个元素中的数据绘制一个标记，然后使用数组的其余部分再次调用该函数

const data=[0,1,2,3,4,5]；
函数绘图标记（数据）{
const[head，…rest]=数据；
if（数据长度）{
//画出你的记号笔
控制台日志（head）；
setTimeout（（）=>plotMarker（rest），1000）；
}
}
plotMarker（data）；

也许您可以将标记创建逻辑封装在

异步方法中，如下所示

通过这样做，您可以继续使用for循环构造，就像当前一样，然后通过以下方式在创建标记之间引入延迟：

await new Promise(resolve => setTimeout(resolve, 3000))

使用此模式，您的代码将如下所示：


异步函数processData（数据）{
对于（变量i=0；isetTimeout（resolve，3000））；
//根据数据创建新标记[i]
常量标记=数据[i]；
log（`create new marker from item:${marker}`）；
/*
markers[data[i].username]=新的L.marker([
数据[i].lat，数据[i].lng
], { 
加：是的，
真的，
图标：redIcon
});
addLayer（标记[data[i].username]）；
标记[data[i].username].bindPopup（'Online:'+data[i].username）；
*/
}
}
processData（[1,2,3,4]）
不太可能，从我所能看到的情况来看，它并没有向我展示我正在尝试的东西