JavaScript に Key-Value 配列を保存する

  2. プログラミングのヒント
  3. JavaScript ハウツー
  4. JavaScript に Key-Value 配列を保存する
Kirill Ibrahim 2023年10月12日
JavaScript JavaScript Array JavaScript Map
  1. JavaScript の Object を使ってキー値の配列を格納する
  2. JavaScript　のマップを使ってキーと値の配列を格納する
JavaScript に Key-Value 配列を保存する

JavaScript の配列は、異なる要素を格納する単一の変数です。要素のリストを格納するために配列が必要になることがあり、各要素はそれによってアクセスするためのインデックスを持っています。JavaScript には、キー値の配列を格納するための異なるメソッドがあります。

JavaScript の Object を使ってキー値の配列を格納する

JavaScript の Object はプロパティを持つ実体であり、各プロパティは値を持っているので、キーと値の用語はそれを扱うことができます。

例：

let obj1 = {id: 1, name: 'Mark', age: 30, country: 'USA'};
obj1.city = 'New York';
obj1['job'] = 'software developer';

console.log(obj1);

出力：

{
age: 30
city: "New York"
country: "USA"
id: 1
job: "software developer"
name: "Mark"
}

これをループさせることができます。

let obj1 = {id: 1, name: 'Mark', age: 30, country: 'USA'};
obj1.city = 'New York';
obj1['job'] = 'software developer';

for (let key in obj1) {
  console.log(key + ' => ' + obj1[key]);
}

出力：

id => 1
name => Mark
age => 30
country => USA
city => New York
job => software developer

配列があれば、配列を一つずつループして、各要素のインデックスからキーを追加し、Object に対応する値を追加することができます。

let arr1 = ['delfstack', 'Computer', 'Science'];

let obj1 = {};

for (let i = 0; i < arr1.length; i++) {
  obj1[i] = arr1[i];
}

for (let key of Object.keys(obj1)) {
  console.log(key + ' => ' + obj1[key])
}

出力：

0 => delfstack
1 => Computer
2 => Science

JavaScript　のマップを使ってキーと値の配列を格納する

マップは、オブジェクトのようなものです。これはキーを持つデータ要素のリストです。異なる点は、Map ではどのようなタイプのキーでも利用できるということです。

JavaScript の Map の構文

let map = new Map();
  • キー => 値を格納します。
map.set('name', 'mark');

Java マップの例

let arr1 = ['delfstack', 'Computer', 'Science'];

let map = new Map();

for (let i = 0; i < arr1.length; i++) {
  map.set(i, arr1[i]);
}

for (let key of map.keys()) {
  console.log(key + ' => ' + map.get(key))
}

出力：

0 => delfstack
1 => Computer
2 => Science

関連記事 - JavaScript Array

関連記事 - JavaScript Map