オブジェクトの代入
今までに登場している物で言えば、連想配列や JSON 形式のデータがオブジェクトと呼ばれる。 データのひとかたまりをそう呼ぶんだなーと思ってもらえると良いかもしれない。
ちなみに細かいことを言うと、配列もオブジェクトの一種なんだって。
基本的な考え方
「キー」と「バリュー」の関係を抑えておこう。
「キー」は表札、「バリュー」は中身。プログラムの例でも key と value で表現されていることも多かったりする。
オブジェクトを作る
オブジェクトの代入の基本は {} を利用する方法。
const example = {
"key": "value"
};これで、example の key という名の下に value という文字列が入る。
キーについてはクォートを省略できるので、
const example = {
key: "value"
};でも同じ事。
複数を入れていきたい場合には、
const example = {
key1: "value1",
key2: "value2"
};というような感じになる。
ちなみにキーに使えるのは変数と同じ条件の文字列。気をつけてね。
オブジェクトを参照する
オブジェクトの中身を扱うときには二つの記法がある。
ドット記法
const example = {
key1: "value1",
key2: "value2"
};
console.log( example.key2 );
// 出力内容: value2ブラケット記法
const example = {
key1: "value1",
key2: "value2"
};
console.log( example["key2"] );
// 出力内容: value2変数を使ってみるとどうなるか
一つ例を見て考えてみよう。
const name = "お名前";
const example = {
name: name
};
console.log( example.name );
// 出力内容は...？整理するとこんな処理になる。
name に「お名前が入る」
オブジェクトを example に代入する
オブジェクトの中身は name: name
キーは文字列表現として扱われるので name のまま
バリューはクォートされていないため変数扱い。つまりは「お名前」
という事で、 example.name を出力すると お名前 が出てくる事になるわけ。
今度は、インデックスに変数を使いたい場合。今回の例ではメリットを感じないかも知れないけど、時によって使える。
const index = "key3";
const example = {
key1: "value1",
key2: "value2",
key3: "value3"
};
// どうしたらindexを利用してexampleから値を取り出せるだろうか？答えは至って簡単。ブラケット記法を利用しよう。
console.log(example[index]);
// 出力内容: value3変数の中身を添字に利用したいというシーンはよくあるけど、このやり方なら扱えそうだね。
複雑なオブジェクト
オブジェクトの中身は階層にすることができる。 今更だけど配列も二次元・三次元と組んでいくことができる。
const staff = {
yamada: {
name: "山田さん",
gender: "male",
age: 28
},
suzuki: {
name: "鈴木さん",
gender: "female",
age: 26
}
};
console.log( staff.yamada.name );
// 出力内容: 山田さん配列の例だと
const example = [
[ 1, 0 ],
[ 2, 4 ],
[ 5, 9 ]
];
console.log( example[2][1] );
// 出力内容: 9こんな感じ。自分で書くことはあまりないと思うけど、受け取るデータがこうなってることはよくあるので憶えておこう。
Last updated