I.はじめに

私たちのプロジェクト開発では、バックエンドからリクエストされたデータを取得するときに、配列を処理する必要があることがよくあります。場合によっては、バックエンドに送信する前にフロントエンドデータの重複を排除する必要があります。返されたデータは、事前に重複排除する必要があります。使用

アレイ重複排除の 2 つのいくつかの方法

1. 2 つの for ループ

実装アイデア: 2 つのループを通じて、外側のループが値を取得するたびに、内側のループはその値が外側のループと同じかどうかのチェックを開始します。同じであれば、同じ値があることを意味します。 splice() メソッドを使用してこの配列を削除します。1 つの項目で、サイクルが完了すると、配列の重複排除の効果が得られます。

      var arr = [1, 2, 3, 4, 1, 3]
      // 两次循环
      function unique(arr) {
        let len = arr.length
        for (let i = 0; i < len; i++) {
          for (let j = i + 1; j < len; j++) {
            if (arr[i] == arr[j]) {
              arr.splice(j, 1)
              j-- //没删除一个 少了一项
              len--
            }
          }
        }
        return arr
      }
      console.log(unique(arr))  // [1,2,3,4]

2. filter() メソッド

実装のアイデア: filter() メソッドを使用して配列をループし、indexOf メソッドを使用して現在の値が最初に出現したかどうかを判断します。最初に出現した場合は true、最初に出現しなかった場合は true になります。、それは false であり、フィルターメソッドは正確に、戻り結果が true になる各項目であり、配列内の重複排除の効果が実現されます。

            let arr = [1, 2, 3, 4, 5, 1, 2];
            function unique(arr) {
                return arr.filter(function (item, index) {
                    return arr.indexOf(item) === index;
                });
            }
            console.log(unique(arr)); // [1,2,3,4,5]

3. 配列の include() メソッド

実装のアイデア: 最初に新しい配列を作成し、ループを使用します。各項目をプッシュする前に、includes () メソッドを使用して、新しい配列に値が存在するかどうかを確認します。存在しない場合は、値を配列にプッシュします。

            let arr = [1, 2, 3, 4, 3, 2, 1];
            function unique(arr) {
                let newArr = [];
                for (let i = 0; i < arr.length; i++) {
                    if (!newArr.includes(arr[i])) {
                        newArr.push(arr[i]);
                    }
                }
                return newArr;
            }
            console.log(unique(arr)); // [1,2,3,4]

4. 配列のindexOf()メソッド

実装アイデア: 実際、これは新しい配列を作成するという点で、indexOf メソッドと似ていますが、新しい配列に項目が存在するかどうかを判断する方法が異なります。ここで、 newArr.indexOf(arr[i]) === -1を判定して、結果が true の場合は、新しい配列に値が存在しないことを意味し、新しい配列に値をプッシュします。

      var arr = [1, 2, 3, 3, 4, 5, 1, 2]
      function unique(arr) {
        let newArr = []
        for (let i = 0; i < arr.length; i++) {
          if (newArr.indexOf(arr[i]) === -1) {
            newArr.push(arr[i])
          }
        }
        return newArr
      }
      console.log(unique(arr))  // [1,2,3,4,5]

5.重複排除方法の設定

      var arr = [1, 3, 4, 5, 1, 23, 4, 5]
      // 去重
      function unique(arr) {
        // return [...new Set(arr)]
        return Array.from(new Set(arr))
      }
      console.log(unique(arr)) // [1,3,4,5,1,23]

3. まとめ

上記は、私が知っている配列の重複排除のより一般的な方法の一部ですが、set 重複排除方法は比較的シンプルで便利です。

コメントエリアで一緒に議論したり学んだりできます

JS 配列重複排除のいくつかの方法