JavaScriptにおけるオブジェクトプロパティ参照エラー

オブジェクトのプロパティにアクセスする場合、 そのプロパティ名を変数に格納することはできません。 その理由を見てみましょう。以下のようなオブジェクトが あるとします：

javascriptlet obj = {a: 1, b: 2, c: 3};

取得したいプロパティの名前が 変数に格納されているとします：

javascriptlet key = 'a';

この変数を使ってオブジェクトのプロパティに アクセスしてみましょう：

javascriptconsole.log(obj.key); // undefined

上記のコードは動作しません。なぜなら、 実際には変数keyに格納されている名前の プロパティではなく、'key'という名前の プロパティを探しているためです。 つまり、実際には私たちのコードは以下と同等です：

javascriptconsole.log(obj['key']);

変数から取得したキーで要素にアクセスする 唯一の方法は、その変数を角括弧内に記述することです：

javascriptconsole.log(obj[key]);

javascriptlet obj = {x: 1, y: 2, z: 3};

let prop = 'x';
console.log(obj.prop);

javascriptlet obj = {x: 1, y: 2, z: 3};

let prop = 'x';
console.log(obj['prop']);