オブジェクトのプロパティ取得方法

Question

JavaScriptでオブジェクトのプロパティにアクセスするとき、
①オブジェクト名.プロパティ名
②オブジェクト名['プロパティ名']
があると思うのですが、使い分けるのに何か違いがあるのでしょうか？調べても2通りあるということまでしか書かれていないので、初学者の質問ですがどなたか教えていただけると幸いです。

Comments

[miyabi_pudding]

ブラケット記法（後者の方）は間にドットはいりませんので、直した方がいいかと。

[hentaiman]

.だけの方が楽

[miyabi_pudding]

hentaimanさん >
わかります。
そして、個人的にですが、.記法の方がわかりやすいです。

Answer 1

基本的な機能は両者で違いはありません。
しかし、下記のような違いがあります。

ドット記法

• 数値やシンボルを添え字として使うことができない。文字列限定
• エディタによっては、添え字にコード補完が効いてくれる（.を打った時に、プロパティ候補が列挙される、など）
• 上記と併せて、プロパティの存在を保証を比較的とりやすい。

ブラケット記法

• 添え字に数値やシンボルを使うことが可能

（特にシンボルは、プライベートフィールド的な宣言も可能にさせやすい）

• 取得プロパティを動的にさせやすい
• 上記のことと併せて、存在保証がないプロパティにアクセスしやすいので、存在保証はしっかりする必要がある
• エディタでのコード補完は基本的に効かない

他にも違いがありますが、ここまでにしておきます。
特に、ブラケット記法は、取得プロパティを動的にさせやすいのが最大の特徴と言えるでしょう。
なので、より動的な、柔軟な記述も可能になります。
（ただし、値保証をしていくのもかなり大事なので、注意）

使い分け的には、
これは案件によったり、人にもよりますが、
基本はドット記法、プロパティの動的取得や、数値やシンボルを添え字にしたい時はブラケット記法、といった使い分けがいいのではないでしょうか？

Answer 2

②オブジェクト名.[‘プロパティ名’]

オブジェクト名['プロパティ名']ですね。.は付きません。引用符も'です。
このブラケット表記を使う理由としては、

• 文字列でプロパティ名を指定できるので、動的にプロパティ名が決まる場合に対応できる
• 識別子として使えない文字(空白など)を含むプロパティ名に対応できる

といったあたりかな。