[JavaScript] オブジェクト（連想配列）の配列の生成・更新・削除を行う

投稿日：2016年10月1日更新日：2018年5月3日

JavaScriptでオブジェクト（連想配列）の配列に関するサンプルです。

オブジェクト（連想配列）の配列を生成

まず、連想配列の配列は以下のように生成できます。

例）オブジェクト（連想配列）の配列を生成する

//例）５件の連想配列を生成
var arr = [
  {no:1, name:"ポチ", age:"3"},
  {no:2, name:"タマ", age:"2"},
  {no:3, name:"モモ", age:"5"},
  {no:4, name:"ミケ", age:"4"},
  {no:5, name:"クロ", age:"8"}
];

//例）５件の連想配列を生成

var arr = [

{no:1, name:"ポチ", age:"3"},

{no:2, name:"タマ", age:"2"},

{no:3, name:"モモ", age:"5"},

{no:4, name:"ミケ", age:"4"},

{no:5, name:"クロ", age:"8"}

];

※これより先のサンプルはこのデータを元にします。

オブジェクト（連想配列）の配列から値を取り出す

連想配列の配列から値を取り出すサンプルです。

例）配列２番目のキーがnameの値を取り出す

var a = arr[1].name;

1	var a = arr[1].name;

上の例だと、"タマ"が取得されます。

オブジェクト（連想配列）の配列から要素を更新する

連想配列の配列の要素を更新するサンプルです。

例）配列３番目のキーがageの値を6に更新する

arr[2].age = "6";

1	arr[2].age = "6";

上の例だと、モモのageが６に更新されます。

オブジェクト（連想配列）の配列から要素を削除する

オブジェクト（連想配列）の配列の要素を削除するサンプルです。

例）オブジェクト（連想配列）の配列の要素を削除するサンプルいろいろ

//例）配列の先頭の要素を削除する
arr.shift();
→ポチのデータが削除されます。

//例）配列の末尾の要素を削除
arr.pop();
→クロのデータが削除されます。

//例）配列の２番目の要素（タマ）を削除
arr.splice(1,1);
→タマのデータが削除されます。

//例）配列の２番目～４番目の要素（タマ、モモ、ミケ）を削除
arr.splice(1,3);
→タマ、モモ、ミケのデータが削除されます。

//例）配列の先頭の要素を削除する

arr.shift();

→ポチのデータが削除されます。

//例）配列の末尾の要素を削除

arr.pop();

→クロのデータが削除されます。

//例）配列の２番目の要素（タマ）を削除

arr.splice(1,1);

→タマのデータが削除されます。

//例）配列の２番目～４番目の要素（タマ、モモ、ミケ）を削除

arr.splice(1,3);

→タマ、モモ、ミケのデータが削除されます。

※spliceの引数には以下を指定します。
　第１引数：削除するインデックス番号
　第２引数：削除する個数

執筆者：とら