JavaScriptのドット表記とは？基本の使い方をわかりやすく解説

この記事では、JavaScriptにおける「ドット表記（Dot Notation）」の基本について、初心者の方にもわかりやすく解説します。

「表記（ノーテーション）」という言葉は少し難しく聞こえるかもしれませんが、実際の仕組みはとてもシンプルです。ドット表記とは、オブジェクトのプロパティにアクセスして値を読み取ったり、新しい値を代入したりするために、ドット（.）を使う方法のことです。

ドット表記で値を読み取る

まず、次のような dog オブジェクトがあるとしましょう。

const dog = {
    name: 'Naya',
    age: 2
}

このオブジェクトから値を1つ読み取りたい場合、たとえば犬の年齢を取得するには、次のように書きます。

console.log(dog.age)
// 結果: 2

これが、ドット表記を使ってオブジェクトから値を読み取る方法です。dog.age のように、オブジェクト名の後にドットを付け、続けてプロパティ名を指定するだけで、目的の値にアクセスできます。

ドット表記で値を代入する

次に、オブジェクトに新しい値を代入してみましょう。たとえば、Nayaが誕生日を迎えて年齢が1つ増えたとします。

// dogに新しい年齢を代入
dog.age = 3

// この状態で console.log(dog.age) を実行すると 3 が返されます。

これが、ドット表記を使ってオブジェクトに値を代入する方法です。読み取るときと同じ書き方で、代入演算子（=）を使って新しい値を設定するだけです。

補足：ドット表記が使えないケース

なお、プロパティ名にスペースやハイフンなどの特殊な文字が含まれている場合は、ドット表記を使用できません。そのような場合には、dog["age"] のように角括弧を使う「ブラケット表記」を利用します。基本的にはシンプルで可読性の高いドット表記を優先しつつ、状況に応じて使い分けるのが良いでしょう。