オブジェクト
オブジェクト
JavaScript で扱うことのできる値の種類として、これまで数値、文字列、論理値を扱ってきました。オブジェクトもまた、JavaScript の値ですが、今まで扱ってきた値とは少し性質が異なります。
オブジェクトを用いると、これまで扱ってきたような単純な値を複数まとめて一つの値として扱うことができます。今まで扱ってきたような「それ以上分解できない」値のことをプリミティブといい、プリミティブでない値はすべてオブジェクトです。
ほかの言語の経験者へ
JavaScript のオブジェクトは、ほかの言語でいう辞書や連想配列、Map に近いものです。ただ、こういったものと比べ、JavaScript のオブジェクトは使用頻度が非常に高いです。
オブジェクトの作成
オブジェクトは、複数のプロパティと呼ばれる値を持ちます。プロパティにはそれぞれ名前がついています。プロパティの名前には文字列しか指定できませんが、プロパティの値としては JavaScript で使用できるすべての値が使用可能です。let person = { name: "田中", age: 18 };
オブジェクトの中にオブジェクトを入れることもできます。
let person = {
name: "田中",
scores: { math: 80, science: 90 },
};
注記
オブジェクトのプロパティは、CSS におけるプロパティと似ているものの、全く異なるものです。文脈により何を意味しているのかが変わるので注意してください。
オブジェクトのプロパティを取得・変更する
ドット記号を用いることで、オブジェクトのプロパティを取得・変更できます。通常の変数のように扱えます。
person.age = person.age + 1;
document.write(person.age);
複合代入演算子
複合代入演算子は、計算と代入を同時に行うことができる演算子です。
x += y は、x = x + y という意味になります。他にも -= や *= などの演算子が定義されています。x -= y はx = x - y、x *= y はx = x * y という意味になります。
複合代入演算子を用いると、先ほどのプログラムは以下のように書くことができます。
person.age += 1;
document.write(person.age);
課題
オブジェクトも値の一種なので、関数の引数や戻り値として使用できます。
age プロパティに 1 を加えたオブジェクトを返す関数 incrementAge を定義してみましょう。
function incrementAge(person) {
// ここに書く
}
let tanaka = { name: "田中", age: 18 };
let nextYearTanaka = incrementAge(tanaka);
document.write(nextYearTanaka.age); // 19 と表示されてほしい