JavaScriptで2つの文字列を結合してオブジェクトを作成する方法

この記事では、2つのカンマ区切りの文字列を受け取り、それらを組み合わせて1つのオブジェクトを生成するJavaScript関数の実装方法を解説します。1つ目の文字列はキー(key)のリスト、2つ目の文字列は値(value)のリストを表しており、両方の文字列に含まれる要素(カンマ区切りの項目)の数は常に同じであると仮定します。

関数の目的は、これらのキーと値の文字列をもとにオブジェクトを構築し、対応する値をそれぞれのキーに正しくマッピングすることです。

実装例

const str1 = '[atty_hourly_rate],
[paralegal_hourly_rate],
[advanced_deposit]';
const str2 = '250,150,500';

const mapStrings = (str1 = '', str2 = '') => {
    const keys = str1.split(',').map((a) => {
        return a.slice(1, -1);
    });
    const object = str2.split(',').reduce((r, a, i) => {
        r[keys[i]] = a;
        return r;
    }, {});
    return object;
};

console.log(mapStrings(str1, str2));

出力結果

上記のコードを実行すると、コンソールには次のように出力されます。

{
    atty_hourly_rate: '250',
    paralegal_hourly_rate: '150',
    advanced_deposit: '500'
}

コードの解説

この関数の処理の流れは以下の通りです。

• キー配列の作成: str1.split(',')でキー文字列を配列に分割し、map()内でslice(1, -1)を使用して各要素の先頭と末尾にある角括弧[ ]を除去しています。
• 値のマッピング: str2.split(',')で値を配列に分割した後、reduce()を使って空のオブジェクト{}を初期値として各値を順番に処理し、同じインデックス位置にあるキー(keys[i])に割り当てていきます。

なお、モダンなJavaScriptでは、Object.fromEntries()とArray.prototype.map()を組み合わせることでも、同様の結果をより簡潔に得ることができます。