JavaScript 배열에서 중복 항목을 제거하는 12가지 방법에 대한 매우 포괄적인 요약

이 기사는 JavaScript 배열 중복 제거를 위한 12가지 방법에 대한 포괄적인 요약을 제공합니다. 이는 특정 참조 가치가 있습니다. 도움이 필요한 친구들이 참고할 수 있기를 바랍니다.

어레이 중복 제거는 일반적으로 인터뷰 중에 접하게 되며, 일반적으로 어레이 중복 제거 방법의 코드를 직접 작성해야 합니다. 질문이 있는 경우 어레이 중복 제거 방법은 무엇입니까? 그 중 10가지에 답할 수 있다면 면접관은 당신에게 깊은 인상을 받을 가능성이 높습니다.
실제 프로젝트에서 접하게 되는 어레이 중복 제거는 일반적으로 백그라운드에서 처리되며 프런트 엔드에서는 어레이 중복 제거를 처리하는 데 거의 사용되지 않습니다. 일상 프로젝트에서 사용할 확률은 상대적으로 낮지만, 인터뷰 중에 질문을 받을 경우를 대비해 알아야 합니다.

배열 중복 제거 방법

1. ES6 Set을 사용하여 중복 제거(ES6에서 가장 일반적으로 사용됨)

function unique (arr) {
  return Array.from(new Set(arr))
}
var arr = [1,1,'true','true',true,true,15,15,false,false, undefined,undefined, null,null, NaN, NaN,'NaN', 0, 0, 'a', 'a',{},{}];
console.log(unique(arr))
 //[1, "true", true, 15, false, undefined, null, NaN, "NaN", 0, "a", {}, {}]

호환성에 관계없이 이 중복 제거 방법은 코드가 가장 적습니다. 이 메서드는 "{}" 빈 개체를 제거할 수 없습니다. 나중에 상위 메서드에서 "{}" 빈 개체를 추가하고 제거합니다.

두 번째, for를 사용하여 중첩한 다음 splice를 사용하여 중복 제거(ES5에서 가장 일반적으로 사용됨)

function unique(arr){            
        for(var i=0; i<arr.length; i++){
            for(var j=i+1; j<arr.length; j++){
                if(arr[i]==arr[j]){         //第一个等同于第二个，splice方法删除第二个
                    arr.splice(j,1);
                    j--;
                }
            }
        }
return arr;
}
var arr = [1,1,&#39;true&#39;,&#39;true&#39;,true,true,15,15,false,false, undefined,undefined, null,null, NaN, NaN,&#39;NaN&#39;, 0, 0, &#39;a&#39;, &#39;a&#39;,{},{}];
    console.log(unique(arr))
    //[1, "true", 15, false, undefined, NaN, NaN, "NaN", "a", {…}, {…}]

이중 레이어 루프, 외부 루프 요소, 내부 루프 비교 값. 값이 동일하면 이 값은 삭제됩니다.
일반적으로 사용되는 ES6 구문을 더 빨리 배우고 싶다면 이전 기사 "ES6 참고 사항 학습 - 업무에서 일반적으로 사용되는 ES6 구문"을 읽어보세요.

3. indexOf를 사용하여 중복 항목을 제거하세요.

function unique(arr) {
    if (!Array.isArray(arr)) {
        console.log('type error!')
        return
    }
    var array = [];
    for (var i = 0; i < arr.length; i++) {
        if (array .indexOf(arr[i]) === -1) {
            array .push(arr[i])
        }
    }
    return array;
}

새 빈 결과 배열을 만들고, 원래 배열을 반복하고, 결과 배열에 현재 요소가 있는지 확인하세요. 동일하지 않은 경우 배열에 푸시합니다.

4. sort()를 사용하세요

function unique(arr) {
    if (!Array.isArray(arr)) {
        console.log('type error!')
        return;
    }
    arr = arr.sort()
    var arrry= [arr[0]];
    for (var i = 1; i < arr.length; i++) {
        if (arr[i] !== arr[i-1]) {
            arrry.push(arr[i]);
        }
    }
    return arrry;
}

sort() 정렬 방법을 사용한 다음 정렬된 결과를 기준으로 인접한 요소를 순회하고 비교하세요.

다섯번째, 객체의 속성이 동일할 수 없다는 특성을 이용하여 중복제거를 합니다

function unique(arr) {
    if (!Array.isArray(arr)) {
        console.log('type error!')
        return
    }
    var arrry= [];
     var  obj = {};
    for (var i = 0; i < arr.length; i++) {
        if (!obj[arr[i]]) {
            arrry.push(arr[i])
            obj[arr[i]] = 1
        } else {
            obj[arr[i]]++
        }
    }
    return arrry;
}

여섯째, include를 사용합니다

function unique(arr) {
    if (!Array.isArray(arr)) {
        console.log('type error!')
        return
    }
    var arrry=[];
    for(vari = 0; i < arr.length; i++) {
            if( !arrry.includes( arr[i]) ) {//includes 检测数组是否有某个值
                    arrry.push(arr[i]);
              }
    }
}

Seven, hasOwnProperty를 사용합니다

function unique(arr) {
    var obj = {};
    return arr.filter(function(item, index, arr){
        return obj.hasOwnProperty(typeof item + item) ? false : (obj[typeof item + item] = true)
    })
}

hasOwnProperty를 사용하여 객체가 있는지 확인합니다. Properties

Eight. 필터를 사용하세요

function unique(arr) {
  return arr.filter(function(item, index, arr) {
    //当前元素，在原始数组中的第一个索引==当前索引值，否则返回当前元素
    return arr.indexOf(item, 0) === index;
  });
}

9. 중복을 제거하려면 재귀를 사용하세요

function unique(arr) {
        var arrry= arr;
        var len = arrry.length;

    arrry.sort(function(a,b){   //排序后更加方便去重
        return a - b;
    })

    function loop(index){
        if(index >= 1){
            if(arrry[index] === arrry[index-1]){
                arrry.splice(index,1);
            }
            loop(index - 1);    //递归loop，然后数组去重
        }
    }
    loop(len-1);
    return arrry;
}

10. Map 데이터 구조를 사용하여 중복을 제거하세요

function arrayNonRepeatfy(arr) {
  let map = new Map();
  let array = new Array();  // 数组用于返回结果
  for (let i = 0; i < arr.length; i++) {
    if(map .has(arr[i])) {  // 如果有该key值
      map .set(arr[i], true); 
    } else { 
      map .set(arr[i], false);   // 如果没有该key值
      array .push(arr[i]);
    }
  } 
  return array ;
}

빈 Map 데이터 구조를 만들고, 필요한 배열을 탐색하세요. 중복을 제거하고 배열의 각 요소를 제거하고 이를 맵에 키로 저장합니다. 동일한 키 값이 Map에 나타나지 않으므로 최종 결과는 중복 제거 후의 결과입니다.

Eleven.Reduce

Array.prototype.unique = function() {
  var sortArr = this.sort();
  var array = [];
  sortArr.reduce((s1,s2) => {
    if(s1 !== s2){
      array .push(s1);
    }
    return s2;
  })
  array .push(sortArr[sortArr.length - 1]);
  return array ;
}

Twelve.[...new Set(arr)]

[...new Set(arr)] 
//代码就是这么少----（其实，严格来说并不算是一种，相对于第一种方法来说只是简化了代码）

PS: 일부 기사에서는 foreach+indexOf 배열 중복 제거 방법을 언급했는데, 개인적으로는 모두 비슷하다고 생각합니다. , 그래서 기록되지 않았습니다.

위 내용은 JavaScript 배열에서 중복 항목을 제거하는 12가지 방법에 대한 매우 포괄적인 요약의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!