JS オブジェクト配列の重複排除のための 3 つの方法の例と比較

JS オブジェクト配列の重複排除のための 3 つの方法の例と比較

1. 重複排除前後のデータの比較

// 元のデータは次のようになります // 重複排除後のデータは次のようになります [{ [{
  "商品ID": "1", "商品ID": "1",
  「クォータ」: 12、「クォータ」: 12、
  "SKUID": "1"
}, },
{ {
  "商品ID": "2", "商品ID": "2",
  「クォータ」: 12、「クォータ」: 12、
  "SKUID": "2"
}, }]
{
  "商品ID": "1",
  「クォータ」: 12,
  "SKUID": "1"
}]

2. 使い方

  1. フィルターとマップの使用🌟🌟🌟🌟🌟
  2. 削減の使用🌟🌟🌟🌟
  3. for ループ 🌟🌟🌟

結論: filter と Reduce の時間差はそれほど大きくありません。filter の方がわずかに高速ですが、filter 構文はより簡潔です。

1. フィルターとマップを使用する

コードは簡潔で使いやすいです。4行のコードで実行できます。平均所要時間は最短です。5つ星の推奨

関数 uniqueFunc(arr, uniId){
  const res = 新しい Map();
  arr.filter((item) => !res.has(item[uniId]) && res.set(item[uniId], 1)); を返します。
}

2. 削減を使用する

コードが少し増え、平均所要時間は最初のものと同等、4つ星の推奨

関数 uniqueFunc2(arr, uniId){
  ハッシュ = {}
  戻り値 arr.reduce((accum,item) => {
    ハッシュ[item[uniId]] ? '' : ハッシュ[item[uniId]] = true && accum.push(item)
    累積を返す
  },[])
}

3. forループの使用

1番目と2番目よりも少し時間がかかりますが、費やされる時間は平均的です。Samsungが推奨しています。

関数 uniqueFunc3(arr, uniId){
  obj = {} とします
  tempArr = [] とします
  for(var i = 0; i<arr.length; i++){
    if(!obj[arr[i][uniId]]){
      tempArr.push(arr[i])
      obj[arr[i][uniId]] = 真
    }
  }
  tempArr を返す
}

3. 2400データに対する3つの方法の処理時間の比較

テスト数フィルターマップ減らすforループ
1 0.139892578125 ミリ秒0.19189453125 ミリ秒0.2060546875 ミリ秒
2 0.12109375 ミリ秒0.1279296875 ミリ秒0.195068359375 ミリ秒
3 0.112060546875ミリ秒0.11767578125 ミリ秒0.174072265625 ミリ秒
4 0.10400390625 ミリ秒0.1728515625 ミリ秒0.18701171875 ミリ秒
5 0.10986328125 ミリ秒0.12890625 ミリ秒0.175048828125 ミリ秒
6 0.113037109375 ミリ秒0.10791015625 ミリ秒0.172119140625 ミリ秒
7 0.134033203125 ミリ秒0.129150390625 ミリ秒0.172119140625 ミリ秒

テスト時間のスクリーンショット表示

要約する

これで、JS オブジェクト配列の重複排除の 3 つの方法と比較に関する記事は終了です。より関連性の高い JS オブジェクト配列の重複排除コンテンツについては、123WORDPRESS.COM の以前の記事を検索するか、次の関連記事を引き続き参照してください。今後とも 123WORDPRESS.COM をよろしくお願いいたします。

以下もご興味があるかもしれません:
  • データページング効果を実現する js オブジェクト
  • JSオブジェクトの走査順序の詳細な説明
  • プレーンな JS オブジェクトの代わりに Map を使用する場合
  • JS オブジェクトのコピー (ディープ コピーとシャロー コピー)
  • js オブジェクト属性名でキャメルケースを下線に変換するサンプルコード
  • jsオブジェクトの読み取り速度の詳細な例

<<:  Ubuntu 18.04 に vsftpd をインストールするための実装コード

>>:  MySQL方言の簡単な紹介

推薦する

より人気がありクリエイティブなダーク背景のウェブデザインの例

暗い背景スタイルのページ デザインは非常に人気があり、シックでエレガント、そして非常にクリエイティブ...

iframe を介してフレームセットを本体に配置する

フレームセットと本文は同じレベルにあるため、本文にフレームセットを配置することはできません。まずペー...

html 内の絶対パス URL と相対パス URL、サブディレクトリ、親ディレクトリ、ルート ディレクトリ

絶対 URL は、インターネット上の特定のファイルに必要なすべてのコンテンツを表すために使用されます...

Youku 動画から 30 秒の広告コードを削除する 2 つの方法

誰もがこんな気持ちになったことがあると思います。30 秒の広告が入った動画を見ると、とても不快に感じ...

Dockerの基本的な手順

目次基本的な指示1. 現在のマシンのコンテナステータスを確認する2. イメージをダウンロードまたは取...

Vue3 の SetUp 関数のプロパティとコンテキスト パラメータの詳細な説明

1. setUp関数の最初のパラメータpropsセットアップ(プロパティ、コンテキスト){}最初のパ...

MySQL 単一テーブルクエリの例の詳細な説明

1. データを準備するこのテーブルでは次の操作が実行されます 学生テーブルを作成 ( id int ...

Docker ネットワークの原理とカスタム ネットワークの詳細な分析

Docker はホストマシン上のブリッジを仮想化します。コンテナを作成して起動すると、各コンテナには...

MySQL では UTF-8 が推奨されないのはなぜですか?

最近、Rails 経由で「utf8」でエンコードされた UTF-8 文字列を MariaDB に保存...

CSS で 2 つの固定列と 1 つの適応列を実装するいくつかの方法

この記事では、CSS で 2 つの固定列と 1 つのアダプティブ列を実装するいくつかの方法を紹介し、...

MySQLの結合の基本原理についての簡単な説明

目次結合アルゴリズム駆動テーブルと非駆動テーブルの違い1. 単純なネストループ結合、単純なネスト、イ...

Dockerを使用してブログサイトを素早く構築する方法の詳細な説明

目次1. 準備2. 展開プロセス3. アクセステストHalo は、ブログに慣れている学生に追加のオプ...

LinuxスレッドのPID(TID、LWP)を取得するいくつかの方法の詳細な説明

Linux C/C++ では、スレッド レベルの操作は通常、pthread ライブラリを通じて実行さ...

node.js が大規模プロジェクトに適さない理由

目次序文1. アプリケーションコンポーネント2. アプリケーションの種類3. アプリケーションサービ...

MySQL 8.0.12 解凍バージョンのインストールチュートリアル

この記事では、MySQL 8.0.12解凍版のインストールチュートリアルを参考までに紹介します。具体...