js 配列から重複を削除する 11 の方法

js 配列から重複を削除する 11 の方法

実際の業務や面接では、「配列の重複排除」の問題によく遭遇します。以下は、js を使用して実装された配列の重複排除のさまざまな方法です。

1.配列の各要素を他の要素と順番に比較し、重複する要素を見つけて削除する

var arr = [1,23,1,1,1,3,23,5,6,7,9,9,8,5,5,5,5];
    console.log(arr); //[1, 23, 1, 1, 1, 3, 23, 5, 6, 7, 9, 9, 8, 5, 5, 5, 5]
    関数noRepeat1(arr) {
        for(var i = 0; i < arr.length-1; i++){
            for(var j = i+1; j < arr.length; j++){
                (arr[i]===arr[j])の場合{
                    arr.splice(j,1);
                    j--;
                }
            }
        }
        arr を返します。
    }
    var arr2 = noRepeat1(arr);
    console.log(arr2); //[1, 23, 3, 5, 6, 7, 9, 8]

2. indexOf() メソッドを使用して、配列内でこの要素が最初に出現する位置の添え字がループの添え字と等しいかどうかを判断します。

var arr = [1,23,1,1,1,3,23,5,6,7,9,9,8,5,5,5];
    console.log(arr); //[1, 23, 1, 1, 1, 3, 23, 5, 6, 7, 9, 9, 8, 5, 5, 5]
    関数noRepeat2(arr) {
        (var i = 0; i < arr.length; i++) の場合 {
            (arr.indexOf(arr[i]) != i) の場合 {
                arr.splice(i,1);//配列要素を削除した後、配列の長さが1減少し、次の要素が前方に移動します i--;//配列の添え字ロールバック}
        }
        arr を返します。
    }
    var newArr = noRepeat2(arr);
    console.log(newArr); //[1, 23, 3, 5, 6, 7, 9, 8]

3. 配列内でフィルターメソッドを使用する

var arr = ['リンゴ','バナナ','梨','リンゴ','オレンジ','オレンジ'];
console.log(arr) //["リンゴ", "バナナ", "梨", "リンゴ", "オレンジ", "オレンジ"]
var newArr = arr.filter(function(値,インデックス,self){
    self.indexOf(値) === インデックスを返します。
});
console.log(newArr); //["リンゴ", "バナナ", "ナシ", "オレンジ"]

4. 新しい配列を使用して、indexOf メソッドを通じて配列内の現在の要素のインデックスを決定します。ループの添え字と等しい場合は、それを新しい配列に追加します。

var arr = [1,23,1,1,1,3,23,5,6,7,9,9,8,5,5,5];
    console.log(arr) //[1, 23, 1, 1, 1, 3, 23, 5, 6, 7, 9, 9, 8, 5, 5, 5]
    関数noRepeat4(arr) {
        var ret = [];
        (var i = 0; i < arr.length; i++) の場合 {
            (arr.indexOf(arr[i]) == i)の場合{
                ret.push(arr[i]);
            }
        }
        ret を返します。
    }
    var arr2 = noRepeat4(arr);
    console.log(arr2); //[1, 23, 3, 5, 6, 7, 9, 8]

5. 空のオブジェクトを使用して、新しい配列にすでに格納されている要素を記録します。

var arr = [1,23,1,1,1,3,23,5,6,7,9,9,8,5];
    console.log(arr) //[1, 23, 1, 1, 1, 3, 23, 5, 6, 7, 9, 9, 8, 5]
    var obj = {};
    var newArr = [];
    for(var i=0;i<arr.length;i++){
        if(!obj[arr[i]]){
            obj[arr[i]] = true;
            新しいArr.push(arr[i]);
        }
    }
    console.log(newArr); //[1, 23, 3, 5, 6, 7, 9, 8]

6. 新しい配列を使用して、新しい配列に要素が存在するかどうかを判断します。存在しない場合は、新しい配列に要素を追加します。

var arr = [1,23,1,1,1,3,23,5,6,7,9,9,8,5];
    console.log(arr); //[1, 23, 1, 1, 1, 3, 23, 5, 6, 7, 9, 9, 8, 5]
    関数noRepeat6(arr){
        var newArr = [];
        for(var i = 0; i < arr.length; i++){
            (newArr.indexOf(arr[i]) == -1)の場合{
                新しいArr.push(arr[i]);
            }
        }
        newArr を返します。
    }
    var arr2 = noRepeat6(arr);
    console.log(arr2); //[1, 23, 3, 5, 6, 7, 9, 8]

7. 新しい配列を使用して、要素が新しい配列に存在するかどうかを判断します。存在しない場合は、要素を新しい配列に追加します (元の配列の長さは変更されませんが、文字列順に並べ替えられます)

var arr = [1,23,1,1,1,3,23,5,6,7,9,9,8,5];
    console.log(arr); //[1, 23, 1, 1, 1, 3, 23, 5, 6, 7, 9, 9, 8, 5]
    関数noRepeat7(arr) {
        var ret = [],
            end; // 繰り返し要素を比較するために使用される一時変数 arr.sort(); // 数値を再ソート end = arr[0];
        ret.push(arr[0]);
        (var i = 1; i < arr.length; i++) の場合 {
            if (arr[i] != end){//現在の要素が一時要素と等しくない場合は、この要素を新しい配列に追加します ret.push(arr[i]);
                終了 = arr[i];
            }
        }
        ret を返します。
    }
    var arr2 = noRepeat7(arr);
    console.log(arr2); //[1, 23, 3, 5, 6, 7, 8, 9]

8. この方法では、新しいアレイの助けを借りて元のアレイを直接変更するのではなく、重複排除後のアレイをソートします。

var arr = [1,23,1,1,1,3,23,5,6,7,9,9,8,5];
    console.log(arr); //[1, 23, 1, 1, 1, 3, 23, 5, 6, 7, 9, 9, 8, 5]
    関数noRepeat8(arr) {
        var end; // 繰り返し要素を比較するために使用される一時変数 arr.sort(); // 数値を再ソート end = arr[0];
        (var i = 1; i < arr.length; i++) の場合 {
            if (arr[i] == end){//現在の要素が一時要素と等しい場合は、配列からこの要素を削除します。arr.splice(i,1);
                私 - ;
            }それ以外{
                終了 = arr[i];
            }
        }
        arr を返します。
    }
    var arr2 = noRepeat8(arr);
    console.log(arr2); //[1, 23, 3, 5, 6, 7, 8, 9]

9. 二重ループは元の配列を変更する

var arr = [1,1,2,2,3,3,4,4,5,5,4,3,1,2,6,6,6,6];
    console.log(arr); //[1, 1, 2, 2, 3, 3, 4, 4, 5, 5, 4, 3, 1, 2, 6, 6, 6, 6]
    関数noRepeat9(arr){
        (var i = 0; i < arr.length; i++) の場合 {
            (var j = 0; j < arr.length; j++) の場合 {
                if (arr[i] == arr[j] && i != j){//繰り返しの数字を削除します arr.splice(j, 1);
                }
            }
        }
        arr を返します。
    }
    var arr2 = noRepeat9(arr);
    console.log(arr2); //[1, 2, 3, 4, 5, 6]

10. 新しい配列の助けを借りて

var arr = [1,1,2,2,3,3,4,4,5,5,4,3,2,1,1,1];
    console.log(arr); //[1, 1, 2, 2, 3, 3, 4, 4, 5, 5, 4, 3, 2, 1, 1, 1]
    var newArr = [];
    (var i = 0; i < arr.length; i++) の場合 {
        var repArr = []; // 繰り返しデータの後の添え字を受け取る // 内部ループは繰り返しデータのある添え字を見つける for (var j = i + 1; j < arr.length; j++) {
            (arr[i] == arr[j])の場合{
                repArr.push(j);//次の繰り返しデータの添え字を見つけます}
        }
        // コンソールログ(repArr);
        if (repArr.length == 0){//繰り返し配列に値がない場合、繰り返しデータではないことを意味します newArr.push(arr[i]);
        }
    }
    console.log(newArr); //[5, 4, 3, 2, 1]

11. ES6が提供するSet構造の助けを借りて

var arr = [1,1,2,2,3,3,4,4,5,5,4,3,2,1,1,1];
    console.log(arr); //[1, 1, 2, 2, 3, 3, 4, 4, 5, 5, 4, 3, 2, 1, 1, 1]
    関数noRepeat11(arr){
        var newArr = [];
        var myset = new Set(arr); //Set構造体が重複したデータを受け取れないという機能を使用する for(var val of myset){
            newArr.push(val)
        }
        newArr を返します。
    }
    var arr2 = noRepeat11(arr)
    console.log(arr2); //[1, 2, 3, 4, 5]

上記は、js 配列の重複排除の 11 の方法の詳細です。js 配列の重複排除の詳細については、123WORDPRESS.COM の他の関連記事に注目してください。

以下もご興味があるかもしれません:
  • JS 配列の重複を排除する 9 つの高度な方法 (実証済みで効果的)
  • JS 配列のフラット化、重複排除、ソート操作の詳細な例
  • JS配列属性の重複排除と重複データの検証
  • 高性能 js 配列重複排除 (12 種類の方法、史上最も包括的)
  • JS配列におけるオブジェクト重複排除の例
  • js配列重複排除方法の概要
  • JS 配列の重複排除の 6 つの方法と完全な例
  • js 配列から重複を削除する N 個の方法 (要約)
  • JS配列の重複排除の一般的な方法の概要[4つの方法]
  • JS配列重複排除の詳細

<<:  MySQL のスローログオンラインの問題と最適化ソリューション

>>:  Linux redis-Sentinel 設定の詳細

推薦する

HTML テーブル マークアップ チュートリアル (37): 背景画像属性 BACKGROUND

テーブル ヘッダーの背景画像を設定します。任意の GIF または JPEG 画像ファイルを使用できま...

アイデアを通じてプロジェクトをDockerにパッケージ化する方法

多くの友人が、Docker でプロジェクトを実行する方法をずっと知りたがっていました。今日は、自分の...

Spark SQL の 4 つの一般的なデータ ソースの詳細な説明

汎用ロード/書き込みメソッドオプションを手動で指定するSpark SQL の DataFrame イ...

jsのイベントループ機構の解析

序文ご存知のとおり、JavaScript は本質的にシングルスレッドですが、ブラウザは非同期リクエス...

Linux デュアル ネットワーク カード バインディング スクリプト メソッドの例

Linux の操作と構成作業では、デュアル ネットワーク カードのバインディングがよく使用されます。...

CSS ペイント API: CSS のような描画ボード

1. Canvas画像をCSS背景画像として使用するCSS ペイント API は、Canvas キャ...

MySQL 8.0.16 圧縮パッケージのインストールと設定方法のグラフィックチュートリアル

この記事では、MySQL 8.0.16圧縮パッケージのインストールと設定方法を参考までに紹介します。...

MySQL InnoDB ストレージ エンジンの詳細

序文MySQL では、InnoDB はストレージ エンジン レイヤーに属し、プラグインとしてデータベ...

Vue を使用して CSS トランジションとアニメーションを実装する方法

目次1. トランジションとアニメーションの違い2. Vueを使用して基本的なCSSトランジションとア...

Docker用国産イメージウェアハウスの使い方

1. 問題の説明何らかの理由により、中国でのDockerイメージのダウンロード速度は特に遅くなります...

ElementUI のネストされたテーブルに基づいて複数選択を実装するためのサンプル コード

序文:私は友人のプロジェクトのバグを修正するのを手伝ったのでこれを書きました。この関数を書くのは初め...

JSはキャンバス技術を使用してeChartsの棒グラフを模倣します

Canvas は HTML5 の新しいタグです。js を使用して Canvas 描画 API を操作...

ウェブ クラスターの Docker Stack 展開方法の手順

Docker はますます成熟し、その機能もますます強力になっています。 Docker Stack を...

React Native スキャフォールディングの基本的な使い方の詳細な説明

プロジェクトを構築する対応するパスでコマンドラインを実行します: react-native init...