「JavaScript」ドット記法とブラケット記法
オブジェクトのプロパティにアクセスする方法は2種類ある。
ドット記法
.(ドット)を使ってプロパティにアクセスする。
var obj = new Object(); //nameというプロパティに"はらこ"という文字を格納する。 obj.name = "はらこ"; //nameというプロパティから値を取得してコンソールに表示する。 console.log(obj.name);
ブラケット記法
[]を使ってプロパティにアクセスする。
var obj = new Object(); //nameというプロパティに"はらこ"という文字を格納する。 obj["name"] = "はらこ"; //nameというプロパティから値を取得してコンソールに表示する。 console.log(obj["name"]);
違いについて
ブラケット記法は、プロパティ名に変数を使うことが出来る。
※ドット記法は変数を使ってプロパティにアクセスできない。
var obj = new Object(); var propertyName = "name" ; obj[propertyName] = "はらこ"; console.log(obj); //Object { name="はらこ"} obj.propertyName = "はらこ"; console.log(obj); //Object { name="はらこ", propertyName="はらこ"}
ブラケット記法は、プロパティ名が不正な文字でもアクセス可能。
不正なプロパティ名:数字で始まるプロパティ名
ドット記法の場合はエラーになる。
//ブラケット記法 var obj = new Object(); var propertyName = "0123" ; obj[propertyName] = "はらこ"; console.log(obj); // Object { 0123="はらこ"} //ドット記法 var obj = new Object(); obj.0123 = "はらこ"; //SyntaxErrorになる console.log(obj.0123); //SyntaxErrorになる
基本はドット記法で書く。
例えば、console.log(obj)をブラケット記法で書くとconsole["log"](obj)になるが、
ドット記法のほうが読みやすい!
ただ、動的にプロパティ名を変更してアクセスしたい場合や、
不正なプロパティ名にアクセスした場合は、ブラケット記法が有効。
意味もなく記述の仕方を混在させないことが大切ですね。
開眼! JavaScript ―言語仕様から学ぶJavaScriptの本質
- 作者: Cody Lindley,和田祐一郎
- 出版社/メーカー: オライリージャパン
- 発売日: 2013/06/19
- メディア: 単行本(ソフトカバー)
- この商品を含むブログを見る