【初級編】JavaScript連想配列(オブジェクト)

今回は連想配列について簡単に説明できたらとおもいます。
今回は key(キー）:value（値）この関係のことを連想配列と呼ぶことにしたいと思います。

📗 連想配列とは

・連想配列とはキーと値がセットで作られている配列となります。

コレまで使ってきた配列は数値0,1,2といったように数値が値に振られて、その数値を指定することで取り出していましたが
連想配列は、値に対して名前みたいなものをつけて、名前を読んだら値が来るみたいなイメージです。

今までは何番収容所の囚人番号何番！って感じだったのが
連想配列を使うと、イケメン小学校のイケメン太郎君！って感じに呼び出しやすくなったのです！

この連想配列を他の言語だとハッシュや辞書なんて言ったりします。
またES６以前は、連想配列という仕組みがなかったようで、オブジェクトで対応していたようです。
ES6以降になって連想配列Mapが使えるようになりました。

初学者の方は、ちょっと何言ってるかわからないと思うので、実際にコードを書いてみましょう。

📗 実践！！

今回はランチの情報を書いてみたいと思います。

　連想配列の基本形
const 変数 ={
  ' キー ' : ' 値 '
};

const の部分は適宜letとかvarとかにしてください。
大切なのは キー :　値　という形になることです。
//取り出し方
console.log(変数[キー]);

 const lunch = {         //lunchという変数に
  'menu':'スープセット',     //キーをmenu,値をスープセット
  'price':'1200円',      //キーにprice,値を1200円　と定義します。
};

console.log(lunch['menu']); //こう書くことで、lunchの中のmenuの値を出力することが出来ます。

console.log(lunch.menu); //このように、.でつなげることで記入を少なくすることも可能です。（省略形）

ランチの種類を増やして見ましょう♪

const lunch = {
 'lunch_1':{
   'menu':'スープセット',
   'price':'1200円',
 },
 'lunch_2':{
   'menu':'生姜焼き定食',
   'price':'1300円',
 },
};

では、生姜焼き定食という情報を出力してみましょう。

 console.log(lunch['lunch_2']['menu']);  //ランチの中のランチ２のメニューを出力してくださいということですね。

 console.log(lunch.lunch_2.menu);        //あるいは、このようにもかけます。

このように、どんどん階層を深くしていくとすごくたくさんの情報を一つの変数に含んで自由に扱うことが可能です！

📗 まとめ

• 連想配列は値に名前（文字）をつけて管理できる。
• 連想配列はたくさんの情報を一つの変数に含める
• 出力するときは[]でもOKだけど、.で省略して書くことが可能！

以上今回はこの辺にしておきます！ご指摘有りましたら編集リクエストまでよろしくお願いいたします！

📗 次回予告

次回は if文について触れていきたいと思います。
お楽しみに！！