共通のキーを持つ JavaScript オブジェクトを、値が結合された新しい配列にマージするにはどうすればよいですか?

JavaScript オブジェクトと共通キーの結合

JavaScript では、オブジェクトの結合は簡単です。ただし、複数のオブジェクトが共通のキーを共有し、それらの値を組み合わせる必要があるオブジェクトの配列を扱う場合、プロセスはより複雑になります。以下の例を考えてみましょう:

<code class="js">var array = [
    {
        name: "foo1",
        value: "val1"
    }, {
        name: "foo1",
        value: ["val2", "val3"]
    }, {
        name: "foo2",
        value: "val4"
    }
];</code>

目的は、同じ名前のキーに関連付けられたすべての値がマージされる形式に配列を再編成することです。予想される出力は次のようになります。

<code class="js">var output = [
    {
        name: "foo1",
        value: ["val1", "val2", "val3"]
    }, {
        name: "foo2",
        value: ["val4"]
    }
];</code>

このマージを実現するには、入力配列を反復処理し、同じ名前のキーを持つ既存のオブジェクトをフィルター処理する効果的なアプローチが 1 つあります。既存のオブジェクトが見つかった場合、その値は新しい値を含むように更新されます。それ以外の場合、新しいオブジェクトが作成され、出力配列に追加されます。

実装例は次のとおりです:

<code class="js">var output = [];

array.forEach(function(item) {
    var existing = output.filter(function(v, i) {
        return v.name == item.name;
    });
    if (existing.length) {
        var existingIndex = output.indexOf(existing[0]);
        output[existingIndex].value = output[existingIndex].value.concat(item.value);
    } else {
        if (typeof item.value == 'string')
            item.value = [item.value];
        output.push(item);
    }
});</code>

このアプローチにより、各名前キーに関連付けられた値が正しくマージされます。出力配列内の単一のオブジェクト。入力配列を反復処理し、既存のオブジェクトと新しいオブジェクトの両方を処理することにより、オブジェクトを共通キーとマージするための包括的なソリューションを提供します。

以上が共通のキーを持つ JavaScript オブジェクトを、値が結合された新しい配列にマージするにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。