javascript - 変数から JS オブジェクトのプロパティ名を設定する方法

Question

JS オブジェクトのプロパティ名を動的に設定する必要があります。

for(i=1; i<3; i++) {
    var key  = i+'name';

    data = {
        key : 'name1',
    }
}

結果は次のようになります。

data = {
    1name: 'name1'
    2name: 'name1'
}

Answer 1

ECMAScript 6 では、次のようにオブジェクト リテラル構文で変数プロパティ名を使用できます。

var keyName = 'myKey';
var obj = {
              [keyName]: 1
          };
obj.myKey;//1

この構文は、次の新しいブラウザーで使用できます。

Edge 12 以降 (IE サポートなし)、FF34 以降、Chrome 44 以降、Opera 31 以降、Safari 7.1 以降

( https://kangax.github.io/compat-table/es6/ )

babelなどのトランスパイラーを使用して、古いブラウザーにサポートを追加できます。rollupやwebpackなどのモジュール バンドラーを使用している場合、プロジェクト全体を簡単にトランスパイルできます。

Answer 2

変数がどこから来るかは問題ではありません。主なものは... 変数名を角括弧 "[ .. ]" で囲みます。

var optionName = 'nameA';
var JsonVar = {
[optionName] : 'some value'
}

Answer 3

jsonVariable = {}
for(i=1; i<3; i++) {        
   var jsonKey  = i+'name';
   jsonVariable[jsonKey] = 'name1'
}

これは次のようになります

    jsonVariable = {
    1name : 'name1'
    2name : 'name1'
}