A360 連想配列

連想配列は、配列の添字に好きな名前をつけることができる配列です。この連想配列で使われる好きな名前をつけた添字のことを「キー」といいます。普通の配列の「添字」と連想配列の「キー」は、呼び方は異なりますが使い方は同じです。今回はこの連想配列について紹介します。

連想配列の基本的な使い方

連想配列は {キー:バリュー} という形を用いて連想配列化を行います。

JavaScript
let fruits = {apple:"りんご", orange:"みかん", grape:"ぶどう", banana:"ばなな"};

上記に様に、{} 内にキーとバリュー を指定して要素を複数格納することができます。

バリューの取得

“配列名.キー” または “配列名[‘キー’]” という書き方を用いることでバリューを取得することができます。

JavaScript
let fruits = {apple:"りんご", orange:"みかん", grape:"ぶどう", banana:"ばなな"};

console.log( fruits.apple );
console.log( fruits["apple"] );

出力結果

JavaScript
りんご
りんご

キーの取得

キーを取得したい場合はObject.keys()構文を用いてキーを取得できます。

JavaScript
let fruits = {apple:"りんご", orange:"みかん", grape:"ぶどう", banana:"ばなな"};
console.log(Object.keys(fruits));

出力結果

JavaScript
apple, orange, grape, banana

要素の追加

バリューの取得と同様の記載方法で、新たなキーとバリューを指定することで要素を追加することができます。

JavaScript
let fruits = {apple:"りんご", orange:"みかん", grape:"ぶどう", banana:"ばなな"};
fruits.strawberry = 'いちご';
console.log(fruits["strawberry"]);

出力結果

JavaScript
いちご

例題

以下コードの出力値はどれか

JavaScript
let animals = {cat:"ねこ", dog:"いぬ", bird:"とり", lion:"らいおん"};
console.log(animals["bird"]);
  1. bird
  2. とり
  3. dog
  4. いぬ
回答

2. とり
キー”bird”のバリューは”とり”なため。

エンジニアからのアドバイス

JavaScriptの連想配列は、記述の基本である上、使えるようになると変数、オブジェクトの理解が深まります。また、キーとバリューをセットにデータとして保持できることも良い点です。JavaScriptの連想配列をしっかりマスターしましょう。

---