NEW ARTICLE
Rocky Linuxでのディスク容量不足を防ぐ設定
  1. HOME
  2. javascript
  3. javascript 2つの配列からそれぞれをkeyとvalueにしたオブジェクトを作成する

javascript 2つの配列からそれぞれをkeyとvalueにしたオブジェクトを作成する

javascript 2つの配列からそれぞれをkeyとvalueにしたオブジェクトを作成する

javascriptで、2つの配列からそれぞれをkeyとvalueにしたオブジェクトを作成するサンプルコードを記述してます。配列それぞれの要素をkeyとvalueにして作成します。ここでは「reduce」を使用して作成します。

目次

環境

  • OS windows11 pro 64bit
  • ブラウザ chrome 109.0.5414.75
Javascript サンプル集はこちら

2つの配列からオブジェクトを作成

2つの配列からオブジェクトを作成するには、「reduce」を使用してそれぞれの配列の要素をkeyとvalueとして生成します。

アロー関数の使い方
const arr_1 = ['a','b','c']
const arr_2 = ['A','B','C']

let obj = arr_2.reduce((accumulator, value, index) => {
  return {...accumulator, [arr_1[index]]: value};
}, {});

console.log(obj); // {a: 'A', b: 'B', c: 'C'}

「key」になる方の配列の要素が少ない場合は、「key」が「undefined」となります。

const arr_1 = ['a','b']
const arr_2 = ['A','B','C']

let obj = arr_2.reduce((accumulator, value, index) => {
  return {...accumulator, [arr_1[index]]: value};
}, {});

console.log(obj); // {a: 'A', b: 'B', undefined: 'C'}

逆に「value」のほうが少ない場合は「key」の数だけしか作成されません。

const arr_1 = ['a','b','c']
const arr_2 = ['A','B']

let obj = arr_2.reduce((accumulator, value, index) => {
  return {...accumulator, [arr_1[index]]: value};
}, {});

console.log(obj); // {a: 'A', b: 'B'}