コンテンツにスキップ

JavaScript 連想配列を扱う

JavaScriptで連想配列(オブジェクト)を扱う方法

連想配列

オブジェクトの定義

連想配列はJavaScriptオブジェクトを用いて、データをKeyValueのペアで扱える配列

const rabbit = {
    // key: value
    'name': 'ウサギ',
    'height': 40,
    'color': '白',
}

オブジェクトの値を取得

  • Keyに対応したValueを取得できる
  • 値の取得方法は、.でつなげるドット記法、[property name]で取得するブラケット記法の2種類
  • 変数で指定する等、可変的にオプジェクトのプロパティにアクセスしたいときはブラケット記法を利用する
console.log(rabbit.color);
// 白

console.log(rabbit["name"]);
// ウサギ

オブジェクトを入れ子にする

const zoo = {
    'rabbit':{
        'name': 'ウサギ',
        'height': 40,
        'color': '白',
    },
    'cat':{
        'name': 'ネコ',
        'height': 30,
        'color': '黒',
    }
}

console.log(zoo['cat']['name']);
// ネコ

連想配列の中に、さらに入れ子で連想配列を入れることも可

上記例をドット記法で取得するなら、zoo.cat.colorとなる

連想配列オブジェクトのループ

for inでオブジェクトのプロパティkeyを取得できる

for (const prop in rabbit) {
    console.log(prop);
}
// "name" "height" "color"

valueを取得したい場合はブラケット記法でアクセスすればよい

for (const prop in rabbit) {
    console.log(rabbit[prop]);
}
// "ウサギ" 40 "白"

Reference

Object
オブジェクトでの作業