JavaScript でオブジェクトの配列をキーと値のペアを持つ単一のオブジェクトに変換するにはどうすればよいですか?

JavaScript でオブジェクトの配列をキーと値のペアを持つオブジェクトに変換する

JavaScript でオブジェクトの配列をキーと値のペアを持つ単一のオブジェクトに変換する高度な配列操作技術を使用する必要があります。ブラウザ互換の方法でこれを実現する方法を見てみましょう。

まず、入力配列の構造を理解しましょう。

var arr = [{"name1":"value1"},{"name2":"value2"},...];

この配列には複数のオブジェクトが含まれており、それぞれに 1 つのキーがあります。 -値のペア。私たちの目標は、配列内のすべてのオブジェクトのキーと値のペアをマージするオブジェクトを作成することです。

Object.assign() と Spread Syntax を使用する

ブラウザと互換性のある最新のソリューションObject.assign() メソッドをスプレッド構文 (...) とともに使用することです。 Object.assign() は、複数のソース オブジェクトのプロパティをターゲット オブジェクトにマージします。 arr 配列でスプレッド構文を使用すると、配列をフラット化し、すべてのオブジェクトを 1 つのソースにマージできます。

var array = [{ name1: "value1" }, { name2: "value2" }],
    object = Object.assign({}, ...array);

console.log(object); // {name1: "value1", name2: "value2"}

この例では、Object.assign() は、arr 配列をマージして新しいオブジェクト (オブジェクト) を作成します。空のオブジェクト {} と、スプレッド構文 (...array) によって作成されたフラット化された配列。これにより、arr 配列内のオブジェクトのすべてのキーと値のペアが 1 つのオブジェクトに結合されます。

古いブラウザのサポート

Object.assign( を持たないレガシー ブラウザをサポートする必要がある場合) またはスプレッド構文の場合、ポリフィルを使用してこれらのメソッドを提供できます。さらに、同じ結果を得るために、reduce() や for ループを使用するなど、他の代替方法もあります。ただし、これらのアプローチは効率が低かったり、より多くのコードが必要になる可能性があります。

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