メンバー演算子

メンバー演算子は、ドット表記法またはブラケット表記法を使用してオブジェクトのプロパティにアクセスする方法を提供します。

構文

object.property
object["property"]

説明

オブジェクトは実際には 連想配列 (別名 mapdictionaryhashlookup table) とみなすことができます。 この配列における キー はオブジェクトのプロパティ名です。プロパティとメソッドを区別してオブジェクトのプロパティを説明するのが一般的です。しかし、プロパティ/メソッドの区別は、慣習的なものにすぎません。メソッドは、たとえば、その値として Function インスタンスへの参照を持つ場合などに、呼び出すことができるプロパティです。

プロパティにアクセスするには 2 つの方法があります。 ドット表記法とブラケット表記法です。

ドット表記法

get = object.property;
object.property = set;

property は有効な JavaScript 識別子、即ち、数字で始まってはいけない、アンダースコア ("_") 及びドル記号 ("$") を含む英数字の連続でなければなりません。 例えば object.$1 は有効ですが、 object.1 はそうではありません。

document.createElement('pre');

ここでは、メソッド名 "createElement" が document から検索され、呼ばれます。

指数と小数点を持たない数値リテラルにメソッドを使用する場合、メソッド呼び出しをするドットの前に空白を入れることで、ドットが小数点とみなされることを防げます。

77 .toExponential();
// or
77
.toExponential();
// or
(77).toExponential();
// or
77..toExponential();
// or
77.0.toExponential();
// because 77. === 77.0, no ambiguity :p

ブラケット表記法

get = object[property_name];
object[property_name] = set;

property_name は文字列です。この文字列は有効な識別子である必要はありません。例えば "1foo"、 "!bar!"、 又は " " (空白文字) であろうが、いかなる値を持つことも出来ます。

document['createElement']('pre');

これは前の例とまったく同じことです。

ブラケット表記法の前にスペースを入れることができます。

document ['createElement']('pre');

プロパティ名

プロパティ名は文字列でなければなりません。これは非文字列オブジェクトがオブジェクトのキーとして利用できないことを意味します。数字を含む全ての非文字列オブジェクトは、toString メソッドを通して文字列へ型変換されます。

var object = {};
object['1'] = 'value';
console.log(object[1]);

これは、1 が '1' に型変換されてから "value" を出力します。

var foo = {unique_prop: 1}, bar = {unique_prop: 2}, object = {};
object[foo] = 'value';
console.log(object[bar]);

これもまた、foo 及び bar のどちらも同じ文字列に変換されてから、"value" を出力します。SpiderMonkey JavaScript エンジンでは、この文字列は "['object Object']" となるでしょう。

メソッドの束縛

メソッドはそのメソッドのオブジェクトに束縛されていません。特に、this はメソッド内で固定されません。即ち、this は必ずしもそのメソッドを含むオブジェクトを参照する必要はありません。this は、代わりに関数呼び出しによって "渡されます"。『メソッドの束縛』を参照してください

eval 上の注意

JavaScript 初心者はしばしば、代わりにブラケット表記法を使えるところで eval を使用する過ちを犯します。例えば次の様な構文です。

x = eval('document.form_name.' + strFormControl + '.value');

eval は低速であるため、出来る限り避けましょう。また、strFormControl もフォームコントロールの名前と ID を必要としない識別子を持つべきです。代わりにブラケット表記法を使った方が良いでしょう。

x = document.forms["form_name"].elements[strFormControl].value;

仕様

仕様 ステータス コメント
ECMAScript 2017 Draft (ECMA-262)
Property Accessors の定義
ドラフト  
ECMAScript 2015 (6th Edition, ECMA-262)
Property Accessors の定義
標準  
ECMAScript 5.1 (ECMA-262)
Property Accessors の定義
標準  
ECMAScript 1st Edition (ECMA-262)
Property Accessors の定義
標準 初期定義。JavaScript 1.0 で実装。

ブラウザー実装状況

機能 Chrome Firefox (Gecko) Internet Explorer Opera Safari
基本サポート (有) (有) (有) (有) (有)
機能 Android Chrome for Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
基本サポート (有) (有) (有) (有) (有) (有)

関連項目

ドキュメントのタグと貢献者

タグ: 
 このページの貢献者: YuichiNukiyama, teoli, ethertank, Potappo
 最終更新者: YuichiNukiyama,