Javascript 与lambda函数参数混淆

我试图在for循环中使用setTimeout和lambda函数，但它只捕获for循环最后一次迭代中lambda函数内容的最后参数。在C#中，我们可以在每次将一个新变量传递到一个新的lambda函数时将其作为参数传递，但这在javascript中似乎不起作用。有什么线索吗

我所说的特定函数是setElementsBydTimed（）

var-gElems=new-Array（）；
document.addEventListener（“DOMContentLoaded”），函数（事件）{
//setElementsById（“图标动画开始”，“图标动画结束”）；
//setTimeout（function（）{setElementsById（'icon_anim_end'，'icon_anim'）；}，500）；
var delay=SetElementsBydTimed（“图标动画开始”，“图标动画结束”，250）；
setTimeout（函数（）{setElementsById（'icon_anim_end'，'icon_anim”）；}，延迟）；
});
函数getElementsById（elementID）{
var elementCollection=新数组（）；
var-allegements=document.getElementsByTagName（“*”）；
对于（i=0；i

而不是

    for(var i = 0; i < elems.length; i++)
    {
        var index = i
        setTimeout(function() {
            setElementId(index, newID);
        }, ms * i);
    }

for（变量i=0；i

使用一个生命-

for（变量i=0；i

问题出在

    for(var i = 0; i < elems.length; i++)
    {
        var index = i
        setTimeout(function() {
            setElementId(index, newID);}, ms * i);
    }

---

这是一个典型的JavaScript闭包问题。基本上，索引变量只有一个实例，它是在lambda函数的上下文之外声明的。所以每个lambda函数都使用相同的索引，它们在循环完成后执行，所以每次调用时索引看起来都超出了范围

要使其正常工作，索引必须具有关闭范围：

function setElementsByIdTimed(elementID, newID , ms)
{
    var elems = new Array();
    elems = getElementsById(elementID);
    console.log("elems.length: " + elems.length);
    gElems = elems;


    for(var i = 0; i < elems.length; i++)
    {
        var index = i
        setTimeout( setClosure(index,newID), ms * i);
    }

    return ms * (elems.length-1);
}
function setClosure( index, newID ) {
    // this lambda is called after the timeout elapses
    return function() {
            setElementId(index, newID);}
}

函数setElementsByIdTimed（elementID，newID，ms）
{
var elems=新数组（）；
elems=getElementsById（elementID）；
console.log（“elems.length:+elems.length”）；
凝胶=元素；
对于（变量i=0；i

你也可以玩一个自我调用的把戏，但这有点心不在焉：

function setElementsByIdTimed(elementID, newID , ms)
{
    var elems = new Array();
    elems = getElementsById(elementID);
    console.log("elems.length: " + elems.length);
    gElems = elems;


    for(var i = 0; i < elems.length; i++)
    {
        var index = i
        setTimeout( (function(idx,nid) {
                return function () {
                    setElementId(idx,nid);}
            })(index, newID),
            ms * i);
    }

    return ms * (elems.length-1);
}

函数setElementsByIdTimed（elementID，newID，ms）
{
var elems=新数组（）；
elems=getElementsById（elementID）；
console.log（“elems.length:+elems.length”）；
凝胶=元素；
对于（变量i=0；i

---

这些实际上是相同的解决方案，但第一种语法可能要简单得多。

这是因为javascript是。顺便说一句，我发现有多个元素具有相同的ID令人不安-虽然它破坏了HTML规范，但每个元素都有自己的特性，我想你也应该使用map函数，而不是for:Best答案！非常感谢。这很清楚，很有意义，也很简洁。我感谢你的帮助！

    for(var i = 0; i < elems.length; i++)
    {

        (function(index){
          setTimeout(function() {
            setElementId(index, newID);}, ms * i);
        })(i);
    }

    elems.forEach(function(index){
        setTimeout(function() {
            setElementId(index, newID);}, ms * i);
        }
    });

function setElementsByIdTimed(elementID, newID , ms)
{
    var elems = new Array();
    elems = getElementsById(elementID);
    console.log("elems.length: " + elems.length);
    gElems = elems;


    for(var i = 0; i < elems.length; i++)
    {
        var index = i
        setTimeout( setClosure(index,newID), ms * i);
    }

    return ms * (elems.length-1);
}
function setClosure( index, newID ) {
    // this lambda is called after the timeout elapses
    return function() {
            setElementId(index, newID);}
}

function setElementsByIdTimed(elementID, newID , ms)
{
    var elems = new Array();
    elems = getElementsById(elementID);
    console.log("elems.length: " + elems.length);
    gElems = elems;


    for(var i = 0; i < elems.length; i++)
    {
        var index = i
        setTimeout( (function(idx,nid) {
                return function () {
                    setElementId(idx,nid);}
            })(index, newID),
            ms * i);
    }

    return ms * (elems.length-1);
}