새소식

반응형
WEB/JavaScript

[JavaScript] 자바스크립트 배열 중복 제거하는 방법.

  • -
반응형

2021-07-11


Photo by Ruben Frivold on Unsplash

자바스크립트 내에서 중복된 값을 가지는 여러 인덱스들이 존재하며, 이를 제거하고 싶어질 수가 있는데, 이럴 경우 일일이 for문과 같은 루프를 돌리는 것보다 간단히 제거하는 방법이 있다. 이 방법을 알아보자.


- 예제

 

아래의 예제는 간단한 문자들을 가지고 있는 배열이며, 불필요하게 중복되는 문자열이 다수 존재하는 것을 확인할 수 있다.

const arr = ['W', 'W', 'o', 'o', 'r', 'l', 'd']

console.log(arr) // [ 'W', 'W', 'o', 'o', 'r', 'l', 'd' ]

- Set

 

set이라는 자료구조는 중복된 값을 포함할 수 없다. 오로지 유니크한 값들만 가지게 되는데, 이를 활용해보자.

const arr = ['W', 'W', 'o', 'o', 'r', 'l', 'd']

const set1 = new Set(arr)

console.log(arr) // [ 'W', 'W', 'o', 'o', 'r', 'l', 'd' ]
console.log(set1) // Set { 'W', 'o', 'r', 'l', 'd' }

 

set1이라는 변수에 Set 객체에 매개값을 중복된 배열 arr을 넣어준 후 출력해 보면 중복된 값들을 제거되고 저장된 것을 확인할 수 있다. 이제 마지막으로 다시 새로운 배열에 담아주면 끝난다.


- Array.from()

 

Array.from() 를 사용하여 배열 형식으로 변환해주면 중복 값이 제거된 배열 데이터 형식으로 정리된다.

const arr = ['W', 'W', 'o', 'o', 'r', 'l', 'd']

const set1 = new Set(arr)

const arr2 = Array.from(set1)

console.log(arr) // [ 'W', 'W', 'o', 'o', 'r', 'l', 'd' ]
console.log(set1) // Set { 'W', 'o', 'r', 'l', 'd' }
console.log(arr2) // [ 'W', 'o', 'r', 'l', 'd' ]

-코드 한줄 정리

 

물론 한줄에 코드를 정리할 수도 있다.

const arr = ['W', 'W', 'o', 'o', 'r', 'l', 'd']

const set1 = new Set(arr)

const arr2 = Array.from(set1)

console.log(arr) // [ 'W', 'W', 'o', 'o', 'r', 'l', 'd' ]
console.log(set1) // Set { 'W', 'o', 'r', 'l', 'd' }
console.log(arr2) // [ 'W', 'o', 'r', 'l', 'd' ]

//한줄로 코드 정리
const arr3 = Array.from(new Set(arr))
console.log(arr3) // [ 'W', 'o', 'r', 'l', 'd' ]

메인 이미지 출처 : Photo by Ruben Frivold on Unsplash  

반응형
Contents

포스팅 주소를 복사했습니다

이 글이 도움이 되었다면 공감 부탁드립니다.