コンテンツにスキップ

JavaScript/ブラケット参照演算子

出典: フリー教科書『ウィキブックス(Wikibooks)』


ブラケット参照演算子 は、ECMAScript の左辺値式(Left-Hand-Side Expressions)の一つで、オブジェクトのプロパティにアクセスするためのブラケット記法([])を使用する構文です。この構文は、ドット記法(.)ではアクセスできない動的なプロパティ名や、識別子として有効でないプロパティ名にアクセスするために使用されます[1]

構文

[編集]
MemberExpression[?Yield, ?Await] [ Expression[+In, ?Yield, ?Await] ]
  • MemberExpression[?Yield, ?Await]: オブジェクトを評価する式。YieldAwait は、ジェネレーター関数や非同期関数内での使用を制御するためのオプションのパラメータです。
  • Expression[+In, ?Yield, ?Await]: プロパティ名を評価する式。+In は、in 演算子のコンテキストで使用されることを示し、YieldAwait は、ジェネレーター関数や非同期関数内での使用を制御するためのオプションのパラメータです。

この構文は、オブジェクトのプロパティにアクセスするために使用され、プロパティの値が返されます。

[編集]

基本的な使用法

[編集]

以下のプログラムは、MemberExpression [ Expression ] の基本的な使用法を示しています。

// 基本的な使用法
const obj = {
  prop1: "value1",
  prop2: "value2"
};

// ブラケット記法を使用してプロパティにアクセス
console.log(obj["prop1"]); // "value1"
console.log(obj["prop2"]); // "value2"

このプログラムでは、obj オブジェクトの prop1prop2 プロパティにブラケット記法を使用してアクセスしています。

動的なプロパティ名での使用

[編集]

以下のプログラムは、動的なプロパティ名での MemberExpression [ Expression ] の使用例を示しています。

// 動的なプロパティ名での使用
const obj = {
  prop1: "value1",
  prop2: "value2"
};

const propName = "prop1";

// ブラケット記法を使用して動的なプロパティ名にアクセス
console.log(obj[propName]); // "value1"

このプログラムでは、動的なプロパティ名 propName を使用して、obj オブジェクトのプロパティにアクセスしています。

識別子として無効なプロパティ名での使用

[編集]

以下のプログラムは、識別子として無効なプロパティ名での MemberExpression [ Expression ] の使用例を示しています。

// 識別子として無効なプロパティ名での使用
const obj = {
  "123": "value1",
  "prop-name": "value2"
};

// ブラケット記法を使用して識別子として無効なプロパティ名にアクセス
console.log(obj["123"]); // "value1"
console.log(obj["prop-name"]); // "value2"

このプログラムでは、識別子として無効なプロパティ名("123""prop-name")にブラケット記法を使用してアクセスしています。

ネストされたオブジェクトでの使用

[編集]

以下のプログラムは、ネストされたオブジェクトでの MemberExpression [ Expression ] の使用例を示しています。

// ネストされたオブジェクトでの使用
const obj = {
  nested: {
    prop1: "nestedValue1",
    prop2: "nestedValue2"
  }
};

// ブラケット記法を使用してネストされたオブジェクトのプロパティにアクセス
console.log(obj["nested"]["prop1"]); // "nestedValue1"
console.log(obj["nested"]["prop2"]); // "nestedValue2"

このプログラムでは、ネストされたオブジェクトのプロパティにブラケット記法を使用してアクセスしています。

関数呼び出しでの使用

[編集]

以下のプログラムは、関数呼び出しでの MemberExpression [ Expression ] の使用例を示しています。

// 関数呼び出しでの使用
const obj = {
  method: function() {
    return "method called";
  }
};

// ブラケット記法を使用してメソッドを呼び出す
console.log(obj[) "method"]; // "method called"

このプログラムでは、obj オブジェクトの method メソッドをブラケット記法を使用して呼び出しています。

注意点

[編集]
  • プロパティ名の制約: ブラケット記法を使用する場合、プロパティ名は文字列またはシンボルでなければなりません。例えば、obj[123]obj["123"] として扱われます。
  • 動的なプロパティ名: ブラケット記法は動的なプロパティ名を扱うのに適していますが、パフォーマンスの観点からはドット記法の方が効率的です。
  • プロパティの存在チェック: 存在しないプロパティにアクセスすると、undefined が返されます。プロパティの存在を確認するには、in 演算子や hasOwnProperty メソッドを使用します。

脚註

[編集]
  1. ^ この構文は、特に動的なプロパティ名を扱う場合に有用です。

外部リンク

[編集]