【JavaScript】オブジェクト配列（連想配列）の操作いろいろ

オブジェクト配列（連想配列）のプロパティ（値）にアクセスする

• キーを指定する(2パターン)

const fruits = {
  banana: 150,
  orange: 200,
};
  //１つめのパターン
console.log(fruits.banana);

  //２つめのパターン
console.log(fruits['banana']);

// 実行結果はどちらも同じ
// 150

オブジェクト配列（連想配列）のプロパティ（値）を操作する

-上記と似たやり方でプロパティを書き換える

const fruits = {
  banana: 150,
  orange: 200,
};

  //１つめのパターン
fruits.orange = 300;
console.log(fruits['orange']);

  //２つめのパターン
fruits['orange'] = 300;
console.log(fruits.orange);

// 実行結果はどちらも同じ
// 300

• キーとプロパティを追加する＆削除する

const fruits = {
  banana: 150,
  orange: 200,
};
  //strawberryというキーと450というプロパティがfruitsオブジェクト配列に追加される
fruits.strawberry = 450;

  //キーを指定して削除する(ここではbananaを削除)
delete fruits.banana;

オブジェクト配列（連想配列）でforEach( )を使う

• オブジェクト配列（連想配列）はforEach( )を使えないので工夫が必要
• Object.keys( )を使う。Object.keys( )とは配列のキーを取り出すメソッド

const fruits = {
  banana: 150,
  orange: 200,
  strawberry: 450,
};
  //fruitsオブジェクト配列（連想配列）のキーを定数（ここではshops)に入れる
const shops = Object.keys(fruits);
  //fruits配列のキーが入ってるshopsからforEach()を使いキーと値を取り出す
shops.forEach(shop => {
  console.log(`${shop} : ${fruits[shop]}`);
}
// 実行結果
// banana : 150
// orange : 200,
// strawberry : 450,

配列とオブジェクト配列（連想配列）を組み合わせる

const fruits = [
  { banana: 150, orange: 200},
  { tomato: 100, onion: 120},
  { fish: 250, meat: 500},
];
console.log(fruits[1].onion);
// 実行結果
// 120