JavaScriptのreduce()メソッドで2次元配列をオブジェクトに変換する方法

JavaScriptでは、名前と年齢などのデータを含む2次元配列（配列の中に配列が入った構造）を扱うことがあります。このようなデータは、キーと値のペアを持つオブジェクトに変換すると、検索や操作が格段に行いやすくなります。

本記事では、Array.prototype.reduce()メソッドを使って2次元配列をオブジェクトに変換する方法を解説します。

変換元となる2次元配列の例

まず、人物の名前と年齢のデータが格納された、以下のような2次元配列を想定します。

const data = [
    ['Rahul', 23],
    ['Vikky', 27],
    ['Sanjay', 29],
    ['Jay', 19],
    ['Dinesh', 21],
    ['Sandeep', 45],
    ['Umesh', 32],
    ['Rohit', 28],
];

各サブ配列の最初の要素（文字列）をキーに、2番目の要素（数値）を値として持つオブジェクトを作成することを目標とします。

reduce()メソッドでオブジェクトを構築する

Array.prototype.reduce()は、配列の各要素を順番に処理しながら、単一の結果（ここではオブジェクト）を累積的に組み立てていくのに最適なメソッドです。初期値として空のオブジェクト{}を渡し、ループ内でキーと値を代入していきます。

const data = [
    ['Rahul', 23],
    ['Vikky', 27],
    ['Sanjay', 29],
    ['Jay', 19],
    ['Dinesh', 21],
    ['Sandeep', 45],
    ['Umesh', 32],
    ['Rohit', 28],
];

const constructObject = arr => {
    return arr.reduce((acc, val) => {
        const [key, value] = val; // 分割代入でキーと値を取り出す
        acc[key] = value;
        return acc;
    }, {});
};

console.log(constructObject(data));

コードのポイント

• 初期値{}: reduce()の第2引数に空オブジェクトを渡すことで、そこへ結果を蓄積します。
• 分割代入: const [key, value] = val;により、各サブ配列から1行でキーと値を取り出せます。
• acc の返却: 各イテレーションで累積オブジェクトaccを必ず返すことで、処理が次の要素へ引き継がれます。

実行結果

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

{
    Rahul: 23,
    Vikky: 27,
    Sanjay: 29,
    Jay: 19,
    Dinesh: 21,
    Sandeep: 45,
    Umesh: 32,
    Rohit: 28
}

補足：Object.fromEntries()を使ったより簡潔な方法

モダンなJavaScript環境では、ES2019で導入されたObject.fromEntries()を利用すると、さらに短く書けます。

const obj = Object.fromEntries(data);
console.log(obj);
// { Rahul: 23, Vikky: 27, ... }

また、new Map(data)でMapオブジェクトを生成してからObject.fromEntries()に渡す方法もあります。状況に応じて使い分けるとよいでしょう。