Javascript 在循环中生成延时函数调用的列表

Javascript 在循环中生成延时函数调用的列表,javascript,Javascript,我正在尝试创建一个函数调用列表,这些函数调用由一个定时间隔分隔。下面的代码当前采用每个函数调用的最后一项 当前代码打印:itemtree、itemtree、itemtree-每个代码间隔10秒 所需的代码打印:itemOne、itemTwo、itemThree——每个代码间隔10秒 //Declare variables var itemList = ["itemOne", "itemTwo", "itemThree"]; var timerInterval = 0; //Loop throu

我正在尝试创建一个函数调用列表,这些函数调用由一个定时间隔分隔。下面的代码当前采用每个函数调用的最后一项

当前代码打印:itemtree、itemtree、itemtree-每个代码间隔10秒

所需的代码打印:itemOne、itemTwo、itemThree——每个代码间隔10秒

//Declare variables
var itemList = ["itemOne", "itemTwo", "itemThree"];
var timerInterval = 0;

//Loop through the itemList and build a list of functions calls
//Each function call will be lined up with a 10 second gap
for(index = 0; index < itemList.length; index++) {
    var item = itemList[index]; 
    setTimeout(function() { doSomethingWithItem(item); }, timerInterval);
    timerInterval = timerInterval + 10000;
}

//Print passed in item 
var doSomethingWithItem = function(item) {
    console.log(item);
}
//声明变量
var itemList=[“项目一”、“项目二”、“项目三”];
var timerInterval=0;
//循环遍历itemList并构建函数调用列表
//每个函数调用将有10秒的间隔
对于(索引=0;索引
我正在尝试列出计时器延迟的函数调用。我需要如何更改上述代码,或者是否有更好的解决方案?感谢您的帮助。

JavaScript通过引用传递值,在超时触发时,
索引将达到其最大值,因此“itemtree”将始终显示。要解决这个问题,您需要为循环变量创建另一个作用域,以便它不会被外部作用域更改

//Loop through the itemList and build a list of functions calls
//Each function call will be lined up with a 10 second gap
for(index = 0; index < itemList.length; index++) {
    // creating new scope for index to live in
    (function(num) {
        var item = itemList[num]; 
        setTimeout(function() { doSomethingWithItem(item); }, timerInterval);
        timerInterval = timerInterval + 10000;
    })(index);
}
//循环遍历itemList并构建函数调用列表
//每个函数调用将有10秒的间隔
对于(索引=0;索引
JavaScript通过引用传递值,在超时触发时,
索引将达到其最大值,因此“itemtree”将始终显示。要解决这个问题,您需要为循环变量创建另一个作用域,以便它不会被外部作用域更改

//Loop through the itemList and build a list of functions calls
//Each function call will be lined up with a 10 second gap
for(index = 0; index < itemList.length; index++) {
    // creating new scope for index to live in
    (function(num) {
        var item = itemList[num]; 
        setTimeout(function() { doSomethingWithItem(item); }, timerInterval);
        timerInterval = timerInterval + 10000;
    })(index);
}
//循环遍历itemList并构建函数调用列表
//每个函数调用将有10秒的间隔
对于(索引=0;索引
我在这种情况下使用的一种方法是在伪递归循环中使用立即调用的函数表达式从列表中一次提取一个元素:

//Declare variables
var itemList = ["itemOne", "itemTwo", "itemThree"];
var timerInterval = 10000;

(function loop() {
    var item = itemList.shift();
    if (item) {
        setTimeout(function() {
            doSomethingWithItem(item);
            loop()
        }, timerInterval);
    }
})();

//Print passed in item 
var doSomethingWithItem = function(item) {
    console.log(item);
}
如果没有
for
循环,则可以避免
变量在每次回调期间具有最后一个赋值的问题


通过伪递归使用
setTimeout
,您还可以避免一次对多个计时器进行排队。我将此用法称为伪递归,因为虽然它可能看起来是
循环
在调用自身,实际上,
setTimeout
调用只会将回调添加到要从浏览器的事件处理循环触发的函数队列中。

在这种情况下,我使用的一种方法是在伪递归循环中使用立即调用的函数表达式,从列表中一次提取一个元素:

//Declare variables
var itemList = ["itemOne", "itemTwo", "itemThree"];
var timerInterval = 10000;

(function loop() {
    var item = itemList.shift();
    if (item) {
        setTimeout(function() {
            doSomethingWithItem(item);
            loop()
        }, timerInterval);
    }
})();

//Print passed in item 
var doSomethingWithItem = function(item) {
    console.log(item);
}
如果没有
for
循环,则可以避免
变量在每次回调期间具有最后一个赋值的问题


通过伪递归使用
setTimeout
,您还可以避免一次对多个计时器进行排队。我之所以称这种用法为伪递归,是因为虽然
循环
似乎在调用自身,但实际上
setTimeout
调用只会将回调添加到从浏览器事件处理循环触发的函数队列中。

我已更正了缩进,以便读者更清楚地看到,但我认为你的解释有点误导。你不能在回答中使用“范围”这个词吗?谢谢,在回答中可以找到“范围”这个词。JS不通过引用传递值。然而,来自更高级别作用域的变量是通过引用访问的,而不是获取它们自己的副本。我已经更正了您的缩进,以便读者更清楚地了解它,但我认为您的解释相当误导。你不能在回答中使用“范围”这个词吗?谢谢,在回答中可以找到“范围”这个词。JS不通过引用传递值。但是,来自更高级别作用域的变量是通过引用访问的,而不是获取它们自己的副本。我喜欢您删除循环的方式,以及同时需要多个计时器。这似乎是我一直在寻找的,谢谢你的帮助。我喜欢你删除循环的方式,以及同时需要多个计时器。这似乎是我要找的,谢谢你的帮助。