JavaScript의 배열에서 중복 제거

1. Set을 사용하여 ECMAScript 6 spread 구문으로 JavaScript에서 중복 제거
2. Array.filter()를 사용하여 JavaScript 배열에서 중복 제거
3. hashtable을 사용하여 JavaScript의 기본 배열에서 중복 제거
4. underscore 및LoDash 라이브러리의_.uniq()함수를 사용하여 JavaScript의 배열에서 중복 제거

이 튜토리얼은 다른 방법을 사용하여 JavaScript의 배열에서 중복을 제거하는 방법을 설명합니다. 방법 중 하나는 대상 배열을Set 클래스의 생성자에 전달하여 동일한 중복되지 않은 배열을 반환하는 것입니다. 또 다른 방법은 JavaScript Array의filter()메서드를 사용하고 콜백 함수에서 테스트 조건을 구현하는 것입니다.

Set을 사용하여 ECMAScript 6 spread 구문으로 JavaScript에서 중복 제거

수학에서 세트는 고유하고 중복되지 않는 요소 그룹을 포함합니다. JavaScript에서Set 클래스는 배열에서 중복되지 않는 모든 요소를 ​​가져올 수 있습니다.

ECMAScript 6에서는Set 클래스를 사용하여Set()생성자에 보내는 중복되지 않은 새 배열을 가져옴으로써 스프레드 구문의 힘을 사용할 수 있습니다.

var arr = [1, 2, 3, 4, 1, 2, 3, 1, 2, 3]

    var uniqueArr = [...new Set(arr)]

console.log(uniqueArr)

출력:

[1, 2, 3, 4]

Array.filter()를 사용하여 JavaScript 배열에서 중복 제거

JavaScript 배열은 filter()라는 상위 함수 중 하나를 도입했습니다.이 함수는 각 배열 요소를 반복하고 여기에 테스트 조건을 적용하며 조건을 충족하는 경우에만 해당 요소를 반환합니다. 이 테스트 조건은 콜백 함수 내에서 구현되며filter()메서드에 인수로 전달됩니다.

현재 요소 인 루프의 인덱스가 해당 배열에서 첫 번째 항목인지 확인하는 테스트 조건을 설정하여 배열에서 중복을 제거 할 수 있습니다. filter()함수는 실행 중에 요소의 배열 색인을 나타내는 추가 인수pos를 사용합니다.

var arrTwo = ['Hello 1 ', ' Hello 2 ', 'Hello 1 ', ' Hello 2 ', 'Hello 1 again']

    const filteredArray = arrTwo.filter(function(ele, pos) {
      return arrTwo.indexOf(ele) == pos;
    })

console.log('The filtered array ', filteredArray);

출력:

The filtered array  (3) ["Hello 1 ", " Hello 2 ", "Hello 1 again"]

JavaScript ES6 화살표 구문을 사용할 수 있다면 중복 작업을 제거하는 것이 더 나은 방법으로 구현됩니다.

var arrTwo =
    ['Hello 1 ', ' Hello 2 ', 'Hello 1 ', ' Hello 2 ', 'Hello 1 again'];
const filteredArray = arrTwo.filter((ele, pos) => arrTwo.indexOf(ele) == pos);
console.log('The filtered array', filteredArray);

출력:

The filtered array  (3) ["Hello 1 ", " Hello 2 ", "Hello 1 again"]

hashtable을 사용하여 JavaScript의 기본 배열에서 중복 제거

숫자[ 1, 2, 3, 4, 1, 2, 3 ]과 같은 기본 유형으로 만 구성된 배열이 있고 해당 배열[ 1, 2, 3, 4 ]에서 중복을 제거하려는 경우 hashtables를 사용하여filterArray()함수를 구현할 수 있습니다.

중복되지 않은 모든 값을 포함하는 found라는 임시 개체를 빌드합니다. filter 함수 내에서 요소가 이미found 객체에 존재하는 경우 조건은false를 반환합니다. 그렇지 않으면 값이 true인 found객체에 해당 요소를 추가합니다.

var arrThree =
    [
      'Hello 1 ', ' Hello 2 ', ' Hello 2 ', 'Welcome', 'Hello 1 again',
      'Welcome', 'Goodbye'
    ]

    function filterArray(inputArr) {
      var found = {};
      var out = inputArr.filter(function(element) {
        return found.hasOwnProperty(element) ? false : (found[element] = true);
      });
      return out;
    }

const outputArray = filterArray(arrThree);
console.log('Original Array', arrThree);
console.log('Filtered Array', outputArray);

출력:

Original Array ["Hello 1 ", " Hello 2 ", " Hello 2 ", "Welcome", "Hello 1 again", "Welcome", "Goodbye"]
Filtered Array ["Hello 1 ", " Hello 2 ", "Welcome", "Hello 1 again", "Goodbye"]

underscore 및LoDash 라이브러리의_.uniq()함수를 사용하여 JavaScript의 배열에서 중복 제거

이미underscore 라이브러리 메서드를 사용하고 있다면 입력 배열에서 요소의 첫 번째 항목 만 반환하므로_.uniq()메서드를 사용할 수 있습니다.

var arrFive = [1, 2, 3, 1, 5, 2];

console.log('LoDash output', _.uniq(arrFive));

LoDash output [1, 2, 3, 5]

여기에서 라이브러리를 가져올 수 있습니다.