Question

我有一个for循环用于运行javascript代码的迭代和For循环中的函数。问题是我的循环中的函数没有接收索引整数。这是代码：

for (var i = 0; i < ToggleCount; i++) {
    ToggleFolder[i] = gui.addFolder(ToggleDescription[i]);
    ToggleChange[i] = { Status: false, Auto: false };
    ToggleStatus[i] = ToggleFolder[i].add(ToggleChange[i], 'Status', false).listen();
    ToggleAuto[i] = ToggleFolder[i].add(ToggleChange[i], 'Auto', false).listen();
    ToggleStatus[i].onFinishChange(function (value, i) {
        console.log(i);
        $.ajax({
            url: 'StatusUpdate.php',
            type: 'get',
            data: 'ToggleDevice=' + ToggleDescription[i] + '&val=' + value,
            success: function (result) { }
       });
       console.log(ToggleDescription[i]);
    });

    ToggleFolder[i].open();
}

问题是console.log命令说＆＃34; i＆＃34;当它进入函数时是未定义的。我的问题是什么？

Answer 1

您遇到了问题，因为您声明了一个接受两个参数的函数：value和i。作为此函数声明的结果，您正在破坏i的原始值。在执行的上下文中，i已知，并且不需要列为参数：

for (var i = 0; i < ToggleCount; i++) {
    ToggleFolder[i] = gui.addFolder(ToggleDescription[i]);
    ToggleChange[i] = { Status: false, Auto: false };
    ToggleStatus[i] = ToggleFolder[i].add(ToggleChange[i], 'Status', false).listen();
    ToggleAuto[i] = ToggleFolder[i].add(ToggleChange[i], 'Auto', false).listen();
    ToggleStatus[i].onFinishChange(function (value) {
        console.log(i);
        $.ajax({
            url: 'StatusUpdate.php',
            type: 'get',
            data: 'ToggleDevice=' + ToggleDescription[i] + '&val=' + value,
            success: function (result) { }
       });
       console.log(ToggleDescription[i]);
    });

    ToggleFolder[i].open();
}

Answer 2

您的第一个问题是您将i重新定义为函数的参数，该函数会覆盖for循环中的i。通过删除该参数，您现在可以在函数内引用该参数：

for (var i = 0; i < ToggleCount; i++) {
    ToggleFolder[i] = gui.addFolder(ToggleDescription[i]);
    ToggleChange[i] = { Status: false, Auto: false };
    ToggleStatus[i] = ToggleFolder[i].add(ToggleChange[i], 'Status', false).listen();
    ToggleAuto[i] = ToggleFolder[i].add(ToggleChange[i], 'Auto', false).listen();
    ToggleStatus[i].onFinishChange(function (value) {
        console.log(i);
        $.ajax({
            url: 'StatusUpdate.php',
            type: 'get',
            data: 'ToggleDevice=' + ToggleDescription[i] + '&val=' + value,
            success: function (result) { }
       });
       console.log(ToggleDescription[i]);
    });

    ToggleFolder[i].open();
}

现在你会遇到另一个问题：当调用onFinishChange函数时，i变量已经改变了（可能它会等于数组的长度），所以你的索引会出错。要解决这个问题，您必须创建一个立即函数来捕获值：

for (var i = 0; i < ToggleCount; i++) {
    ToggleFolder[i] = gui.addFolder(ToggleDescription[i]);
    ToggleChange[i] = { Status: false, Auto: false };
    ToggleStatus[i] = ToggleFolder[i].add(ToggleChange[i], 'Status', false).listen();
    ToggleAuto[i] = ToggleFolder[i].add(ToggleChange[i], 'Auto', false).listen();
    ToggleStatus[i].onFinishChange((function(index){
        return function (value) {      
            console.log(index);
            $.ajax({
                url: 'StatusUpdate.php',
                type: 'get',
                data: 'ToggleDevice=' + ToggleDescription[i] + '&val=' + value,
                success: function (result) { }
           });
           console.log(ToggleDescription[index]);
    })
    })(i));

    ToggleFolder[i].open();
}

传递For循环索引以在For循环内运行

2 个答案: