オブジェクトのプロパティを動的に設定する

JavaScriptでは、計算プロパティ名を利用することでオブジェクトのプロパティを動的に設定することができます。

計算プロパティ名は下記のように使用することができます。

let i = 0
const a = {
  ['foo' + ++i]: i,
  ['foo' + ++i]: i,
  ['foo' + ++i]: i,
}
console.log(a); // { foo1: 1, foo2: 2, foo3: 3 }

オブジェクトaにプロパティfoo1 foo2 foo3を動的に設定することができました。
このように、計算プロパティ名を利用することでオブジェクトのプロパティを動的に設定することができます。

動的に設定された値にアクセスする場合は、基本的にブラケット記法でアクセスします。

const space = ' ';
const a = {
  [space]: 'space',
}
console.log(a)         // { ' ': 'space' }
console.log(a[space]); // space
console.log(a[' ']);   // space
}

参考

オブジェクト初期化子
プロパティアクセサー