JavaScriptでキー配列と値配列を受け取り、値を対応するキーにマッピングしたMapを作成する方法

問題の概要

次のような2つの配列があると仮定します。

const keys = [0, 4, 2, 3, 1];
const values = ["first", "second", "third", "fourth", "fifth"];

ここで求められているのは、このキーの配列と値の配列を引数として受け取り、各値を対応するキーに関連付けたMapオブジェクトを生成して返すJavaScript関数を作成することです。

期待される出力イメージは以下の通りです。

Map(5) {
  0 => 'first',
  4 => 'second',
  2 => 'third',
  3 => 'fourth',
  1 => 'fifth'
}

実装の考え方

JavaScriptには標準でMapオブジェクトが用意されています。Mapは任意の値をキーとして扱えるデータ構造で、set()メソッドを使うことでキーと値のペアを簡単に追加できます。

実装の流れはシンプルです。new Map()で空のMapを作成し、forループでkeys配列を先頭から順に走査しながら、同じインデックス位置にあるvalues配列の要素を対応するキーとしてセットしていきます。

コード例

const keys = [0, 4, 2, 3, 1];
const values = ["first", "second", "third", "fourth", "fifth"];

const buildMap = (keys, values) => {
  const map = new Map();
  for (let i = 0; i < keys.length; i++) {
    map.set(keys[i], values[i]);
  }
  return map;
};

console.log(buildMap(keys, values));

実行結果

コンソールには次のように出力されます。

Map(5) {
  0 => 'first',
  4 => 'second',
  2 => 'third',
  3 => 'fourth',
  1 => 'fifth'
}

出力を見ると、元のkeys配列の順序（0, 4, 2, 3, 1）がそのまま保持され、各インデックスの値が正しく対応付けられていることがわかります。Mapは挿入された順序を維持するため、このような結果になります。

補足：より簡潔に書く方法

Mapコンストラクタは「[キー, 値]」のペアからなる配列をそのまま引数に取ることができます。これをArray.prototype.map()と組み合わせると、明示的なループなしでより関数型らしい簡潔なコードに書き換えられます。

const buildMap = (keys, values) =>
  new Map(keys.map((key, i) => [key, values[i]]));

console.log(buildMap(keys, values));
// Map(5) { 0 => 'first', 4 => 'second', 2 => 'third', 3 => 'fourth', 1 => 'fifth' }

どちらの書き方でも結果は同じですが、要素数が多い場合や処理を再利用したい場合は、後者の宣言的なスタイルの方が読みやすく保守性も高くなります。