問題一覧に戻る
中級es6
問題84: 計算されたプロパティ名

ES6の計算されたプロパティ名を学びましょう。ブラケット記法を使って、実行時に動的にプロパティ名を決定できます。変数の値、文字列の連結、関数の返り値など、任意の式の評価結果をプロパティ名として使用できます。動的なデータ構造の作成、メタプログラミング、設定オブジェクトの生成など、実行時の柔軟性が必要な場面で威力を発揮します。

// 計算されたプロパティ名
const key1 = "プロパティ";
const key2 = "アイテム";

// 動的なキー
const obj = {
  key1 + 1: "値1",
  [`${key2}_2`]: "値2"
};

console.log("オブジェクト: " + JSON.stringify(obj));

// オブジェクト作成
function createObject(prefix, num) {
  return {
    prefix + num: `値${num}`
  };
}

const result = createObject("prop", 3);
console.log(result);