Question

我有一个循环数组的函数......虽然它工作似乎改变了从“开始”函数发送到“处理”函数的信息的值，但我不知道为什么......我我确定我犯了一个愚蠢的错误，但我看不出错误= /

这是我的功能：

var array_data = data[9]; //global array to use
console.log(array_data); //debug

function process(i){
alert('Number is '+i); // shows the value "7" (should show value "1")
}

function begin(){
var count = 0;

for(i in array_data){

if(parseInt(array_data[i][9])){ //if true

    var result = create_layout(i); //function to make the layout
    alert('Number is '+i); //shows the value "1" (this is correct so far)

   document.getElementById('result'+count).innerHTML = result;  
   document.getElementById('result'+count).onclick = function() { process(i); };    

count++;

       }
}   

window.onload = function() {  
begin();  
};

以下是我在控制台日志中的（array_data）数组：

1: Array[10]
   0: "Car One"
   1: "1"
   2: "3"
   3: "d2.jpg"
   4: "1"
   5: "1"
   6: "200"
   7: "85"
   8: "5000"
   9: "1"
length: 10    

7: Array[10]
   0: "Car Two"
   1: "1"
   2: "1"
   3: "e2.jpg"
   4: "1"
   5: "0"
   6: "500"
   7: "50"
   8: "3000"
   9: "0"
length: 10

所以我想知道为什么它会在到达过程函数时改变“i”的值？

Answer 1

当实际调用onclick函数时，i的值会因为它所在的循环而发生变化。你应该“锚定”它的值。最简单的方法就是这样：

for( some loop on `i`) {
    (function(i) {
        // your code that depends on `i`
    })(i);
}

这将确保i的值不会在该闭包内发生变化（除非您自己更改）

Answer 2

~~请勿使用for-in-loops on arrays~~ （好的，此处不适用）
您的begin函数
只需使用window.onload = begin; - 无需额外功能
然而，您的i变量需要额外关闭。事件处理程序执行的时间，它将使用变量i - 其当前值是它在上一个循环周期中获得的值。您的count变量可能与此问题相同。

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

    <...>.onclick = function() { ...i...; };    

})(i);

Answer 3

在ECMAScript 5中，您可以继续使用bind将参数绑定到您的函数：

document.getElementById('result' + count).onclick = process.bind(null, i);

如果您不必担心Internet Explorer 8及更早版本，那就太棒了。

JS Array无条件地传递值更改

3 个答案: