配列にオブジェクトを入れる

01 / 04

同じ形のものが増えたら

本が1冊なら book というオブジェクトひとつでいい。でも3冊あったら？

book1 book2 book3 と変数を増やすのは、配列を学ぶ前と同じつらさだよね。同じ形のものが並ぶなら配列だった。

02 / 04

要素にオブジェクトを置く

配列の要素は数値や文字列だけじゃない。オブジェクトもそのまま要素にできる。

[ ] の中に { } を並べる形になるよ。読みやすいように1件ずつ改行して書くのがふつうだよ。

const books = [  { title: "そらのほん", price: 800 },  { title: "うみのほん", price: 1200 },];console.log(books[0].title);

実行結果

そらのほん

03 / 04

2段階で取り出す

books[0].title は一気に見ると難しそうだけど、2段階に分けて読めば簡単だよ。

books[0] … 配列の1件目を取り出す。中身はオブジェクト
.title … そのオブジェクトの title を取り出す

左から順にたどっていくだけ。慣れるまでは指でなぞって読もう。

const books = [  { title: "そらのほん", price: 800 },  { title: "うみのほん", price: 1200 },];const second = books[1];console.log(second.title);console.log(books[1].price);

実行結果

うみのほん
1200

04 / 04

書き換えも同じ形

取り出せるということは、書き換えもできる。books[0].price = 900; のように、左側に置くだけだよ。

ここまでで「配列」「オブジェクト」「入れ子」がそろった。次はこれを繰り返しで一気に処理してみよう。

const books = [  { title: "そらのほん", price: 800 },];books[0].price = 900;console.log(books[0].price);

実行結果