javascript - JavaScript 関数で定数を設定する

Question

このコードを見てください：

var arr = new Array();
for (var i = 0; i < 10; i++) {
    arr[i] = {
        func:function() {
            console.log(i);
        }
    }
}
arr[0].func();

私はこれがうまくいくと思っていたので、これに混乱しています。私は基本的に、関数が作成されたときに指定された値を配列内の各オブジェクトに出力させたいと考えています。

を呼び出すとfunc()、コンソールに 10 が出力されます。0, 1, 2, 3, 4, 5, 6, 7, 8, 9代わりに印刷する方法はありますか？ありがとう！

Answer 1

問題は、内部の関数が毎回増加する変数「i」を参照していることです。次のように、関数と一緒にオブジェクトの各反復で「i」の値を格納できます。

http://jsfiddle.net/Sgnvp/

var arr = new Array();
for (var i = 0; i < 10; i++) {
    arr[i] = {
        func:function() {
            console.log(this.value);
        },
        value: i
    }
}
arr[0].func();

Answer 2

値をカプセル化するには、クロージャを作成する必要があります。ここで私はそれを呼び出しconsoleItて渡していiます。consoleItの周りにクロージャを作成しますi

var arr = [];

function consoleIt (i) {
    return function () {
        console.log(i);
    }
};

for (var i = 0; i < 10; i++) {
    arr[i] = { 
        func: consoleIt(i)
    };
}

arr[0].func();

Answer 3

これは、thebreiflabb が行った方法よりも優れているわけではありませんが、知っておく価値のある興味深い手法です。

    var arr = [];

    for (var i = 0; i < 10; i++){

      (function(i){
        arr[i] = {
          func : function(){
            console.log(i); 
          }
        };
      })(i);

    }

    arr[0].func();

スコープ i に匿名クロージャを使用するだけです。