プロパティへのアクセス

オブジェクトのプロパティへのアクセスは、ドット表記法またはブラケット表記法を使用して行われます。

The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request.

構文

object.property
object['property']

説明

オブジェクトは実際には連想配列（別名 map、 dictionary、 hash、 lookup table）とみなすことができます。この配列におけるキーはオブジェクトのプロパティ名です。一般的には、オブジェクトのプロパティについて説明する際にプロパティとメソッドをします。しかし、プロパティとメソッドの区別は、慣習的なものにすぎません。メソッドは呼び出すことができるプロパティ、つまり、メソッドは、言ってみれば、値として関数インスタンスへの参照を持つ場合などに、呼び出すことができるプロパティです。

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

ドット表記法

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

property は有効な JavaScript 識別子です。つまり、英数字とアンダースコア （_）、ドル記号（$"）の並びで、数字で始めることはできません。例えば object.$1 は有効ですが、 object.1 は有効ではありません。

document.createElement('pre');

ここでは、 document から "createElement" という名前のメソッドが検索され、呼び出されます。

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

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

ブラケット表記法

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.forms.form_name.elements.' + strFormControl + '.value');

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

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

仕様

ブラウザー実装状況

このページの互換性一覧表は構造化データから生成されます。データに協力したいのであれば、 https://github.com/mdn/browser-compat-data をチェックアウトしてプルリクエストを送信してください。

関連項目

• Object
• Object/defineProperty