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 設定の詳細

推薦する

IE6/7 は混乱するだろう: 空のテキスト ノードの高さの問題

序文: ietester でドキュメント コードを表示するには、debugbar を使用します。すべ...

HTML+CSS でハートビートの特殊効果を作成する

今日は、シンプルなハートビート効果を作成します。多くのコードは必要ありません。ボックスを追加し、CS...

テーブルを作成するための HTML dl、dt、dd タグとテーブル作成テーブル

ウェブサイトの開発とメンテナンスのコストが削減されるだけでなく、コードもよりセマンティックになります...

React + Threejs + Swiper パノラマ効果を実現するための完全なコード

パノラマビュー効果を見てみましょう: 住所を表示スクリーンショット: 体験してみると、周囲の環境がぐ...

MySQL自動シャットダウン問題への対処の実践記録

最近、あるプロジェクトを手伝ったのですが、MySQL マシンがしばらくすると自動的に停止し続けました...

Ubuntu 20.04 に Python 3 仮想環境をインストールする詳細なチュートリアル

以下はすべて仮想マシン上で実行されます1. pip3をインストールするsudo apt で pyth...

CSSのさまざまな背景、使用シナリオ、テクニックの詳細な分析

この記事はGitHub https://github.com/qq449245884/xiaozhi...

Dockerfile を使用して SpringBoot プロジェクトをデプロイする方法

1. SpringBoootプロジェクトを作成し、jarパッケージにパッケージ化する2. Linux...

Nginx リバース プロキシを使い始める

目次概要リバースプロキシの役割Nginx リバース プロキシ イントラネット侵入 8081 ポートの...

Linux環境でのDockerインストールチュートリアル

1. 設置環境Dockerは次のCentOSバージョンをサポートしていますCentOS 6.5 (6...

CSS3 でシンプルな白い雲が浮かぶ背景効果を実現

これは非常にシンプルな純粋な CSS3 の白い雲の浮遊する背景効果です。浮かぶ白い雲の特殊効果は、C...

MySQLデータを復元する2つの方法

1. はじめに少し前、開発者がテスト環境や本番環境で誤った操作をし、データベースを誤って削除/更新し...

JavaScript の useRef と useState の紹介

目次1. useStateフック2. useRefフック3. useRef と useState 4...

mysql 8.0.19 winx64.zip インストール チュートリアル

この記事は参考までにmysql 8.0.19 winx64.zipのインストールチュートリアルを記録...

XHTML チュートリアル: Transitional と Strict の違い

実際、XHTML 1.0 は、Transitional DOCTYPE と Strict DOCTY...