概要
この記事では、ドット記法とブラケット記法についての説明や、各々の違いと使い分けについてまとめたいと思います。
(こちらの自ブログのリライトになります。)
ドット記法
この章ではドット記法について説明をしていきます。
説明
例えばデータとして次のjsonが存在していたとします。
res = {count: "100",status:"200"}
この中からcountの値を取り出すとするとドット記法だと下記のように書けます。
res.count
この取り出し方をドット記法と呼びます。
メリット
- シンタックスが簡潔で読みやすく、最も一般的に使用されます。
デメリット
- プロパティ名はリテラルでなければなりません。つまり、変数やキーワードではない固定の名前を使用します。
- プロパティ名にはスペースや特殊文字を含めることができません。
- 頭文字が数字から始まるプロパティ名も採用できません。
ブラケット記法
この章ではブラケット記法について説明をしていきます。
説明
前の説明と同じように、データとして次のjsonが存在していたとします。
res = {count: "100",status:"200"}
この中からcountの値を取り出すとするとブラケット記法だと下記のように書けます。
res['count']
この取り出し方をブラケット記法と呼びます。
メリット
- プロパティ名にスペースや特殊文字が含まれている場合や、数字で始まる場合にも使用できます。
res['10cm']みたいな使い方ができるってことです。 - 計算されたプロパティ名や、動的にプロパティ名を決定する場合に便利です。ということは
res[${num}]とかできるってことです。競プロとかやってる人だと結構馴染みが多い使い方だなと感じます。
デメリット
-
文字列リテラルを使用する場合、タイプミスがコンパイル時には検出されず、実行時にのみ発見される可能性があります。これは、プロパティ名がハードコーディングされているためです。
-
一部のJavaScriptエンジンでは、ブラケット記法がドット記法に比べてわずかに遅くなる可能性があります。これは、ブラケット記法ではプロパティ名が文字列として評価されるため、追加の計算が必要になる場合があるためです。
まとめ
個人的に覚えておく必要がありそうなところをpickするとすれば、固定のプロパティ名にはドット記法が向いており、変数や特殊文字を含むプロパティ名にはブラケット記法が適しているという点かなと思っています。
感想
PRを投げた時にご指摘をいただき、調べた内容をまとめてみたのですが、結構学びになりました。普段使っている記法ですが、メリデメあるので、今後はしっかり考えて選びたいと思います。
あとちょっと競プロが懐かしくなったので来年ちゃんとやろうと思います(多分)
参考文献