[解決済み】JavaScriptのオブジェクト変数に追加する動的キーの作成方法【重複あり

質問

このようなことを試しているのですが、この例ではうまくいきません。

jsObj = {};

for (var i = 1; i <= 10; i++) {
    jsObj{'key' + i} = 'example ' + 1;
}

このような動的なキーを作るにはどうしたらよいのでしょうか？

どのように解決するのですか？

角括弧で囲む。

jsObj['key' + i] = 'example' + 1;

JavaScriptでは、すべての配列はオブジェクトですが、すべてのオブジェクトが配列であるわけではありません。主な違いは（そして、JavaScriptとオブジェクトをそのまま使うのはかなり難しいのですが）、配列のインスタンスでは length プロパティは、名前が数値で、その値が数値に変換されたときに、そのようなプロパティの中で最大となるプロパティの1プラス数値を反映するようにします。奇妙に聞こえますが、これは、配列インスタンスにおいて "0" , "5" , "207" などはすべて特別に扱われ、その存在によって length . そして、その上、その値は length は、次のようになります。 セット に変更します。 削除 というプロパティがあります。を設定することで length を配列の 0 は、名前が整数のように見えるすべてのプロパティを効果的に削除します。

なるほど、これが配列の特徴なんですね。しかし、これらはすべて、JavaScriptの [ ] 演算子が動作します。この演算子はオブジェクトのプロパティにアクセスする仕組みで、どんなオブジェクトに対しても機能します。この点で、数値配列のプロパティ名は、単純なプロパティアクセスという点では特別なものではないことに注意することが重要です。 JavaScriptのオブジェクトのプロパティ名には、どのような文字列でも使用することができます。

このように [ ] 演算子は for ループで配列を繰り返し処理します。

for (var i = 0; i < myArray.length; ++i) {
  var value = myArray[i]; // property access
  // ...
}

は、実際には [ ] は、名前が何らかの計算された文字列であるプロパティにアクセスするときに動作します。

var value = jsObj["key" + i];

は [ ] 演算子は 正確に は、どちらも同じことです。つまり、片方のケースでは関係するオブジェクトがたまたま配列であったという事実は重要ではありません。

いつ 設定 を使用したプロパティ値です。 [ ] ということであれば、話は同じです。 ただし を維持するための特別な動作のために length プロパティがあります。配列インスタンスに数値キーを持つプロパティを設定した場合。

myArray[200] = 5;

とすると、（"200" が最大の数値のプロパティ名であると仮定して、）その length プロパティは次のように更新されます。 201 を、プロパティ代入の副次的効果として使用します。しかし、同じことをプレーンなオブジェクトに対して行った場合。

myObj[200] = 5;

というような副作用はありません。 配列とオブジェクトの両方の "200" というプロパティに値が設定されます。 5 で、それ以外は全く同じです。

と思うかもしれませんが、それは length の動作はちょっと便利なので、いっそのこと すべて オブジェクトのインスタンスを作成します。 それについて直接的に間違っていることはありません（ただし、特に他の言語に精通している人にとっては、いくつかのプロパティが length が、他のものはない)。 しかし、JSONシリアライズを扱っている場合（かなり一般的なことです）、配列のインスタンスがJSONにシリアライズされる方法を理解してください。 のみ は、数値で名付けられたプロパティが含まれます。配列に追加された他のプロパティは、シリアライズされたJSONの形には決して現れません。ですから例えば

var obj = [];
obj[0] = "hello world";
obj["something"] = 5000;

var objJSON = JSON.stringify(obj);

objJSON"の値には、以下の文字列のみが含まれます。 ["hello world"] プロパティは失われます。

ES2015

ES6のJavaScriptの機能を利用できるようになれば 計算されたプロパティ名 を使用すると、非常に簡単に処理することができます。

var key = 'DYNAMIC_KEY',
    obj = {
        [key]: 'ES6!'
    };

console.log(obj);
// > { 'DYNAMIC_KEY': 'ES6!' }