ホームページ > ウェブフロントエンド > jsチュートリアル > JavaScript でオブジェクトの配列から一意の値を効率的に取得する方法

JavaScript でオブジェクトの配列から一意の値を効率的に取得する方法

Patricia Arquette
リリース: 2024-12-05 05:17:09
オリジナル
666 人が閲覧しました

How to Efficiently Retrieve Unique Values from an Array of Objects in JavaScript?

JavaScript でオブジェクトの配列から個別の値を取得する

最適なアプローチ

効率的に取得するにはオブジェクトの配列からの一意の値、スプレッド演算子と Set データ構造の組み合わせ雇用することができる。 ES6 以降のバージョンの JavaScript では、次のアプローチが強く推奨されます。

const data = [
  { name: "Joe", age: 17 },
  { name: "Bob", age: 17 },
  { name: "Carl", age: 35 }
];

const distinctAges = [...new Set(data.map(item => item.age))];

console.log(distinctAges); // [17, 35]
ログイン後にコピー

このアプローチでは、Set の機能を利用して重複する値を削除し、スプレッド演算子を利用して一意の値から新しい配列を作成します。マップ関数は配列を反復処理し、さらなる処理のために年齢プロパティ値のみを抽出します。

代替データ構造

データを一意のオブジェクトの配列として構造化する場合キーが優先される場合は、Map データ構造を利用できます:

const data = new Map([
  ["1", { name: "Joe", age: 17 }],
  ["2", { name: "Bob", age: 17 }],
  ["3", { name: "Carl", age: 35 }]
]);

const distinctAges = [...data.values()].map(item => item.age);

console.log(distinctAges); // [17, 35]
ログイン後にコピー

このシナリオでは、データ変数は一意のキーを持つ Map です。 (例: "1"、"2"、"3") および対応するオブジェクト値。個別の年齢を取得するには、values プロパティを使用して値の配列を作成し、それらをマップして年齢プロパティ値のみを抽出します。

非効率な反復の回避

上記のように Set データ構造または Map データ構造を活用すると、各配列要素を反復処理して既存の値を確認する必要がなくなります。これらのデータ構造は一意性をネイティブに処理し、面倒な反復を必要とせずに、より効率的なソリューションを提供します。

以上がJavaScript でオブジェクトの配列から一意の値を効率的に取得する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
著者別の最新記事
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート