자바스크립트 배열과 문자열 중복 제거 방법 완벽정리
2025-02-08 11:39:44자바스크립트 배열과 문자열 중복 제거하기
자바스크립트로 개발을 하다 보면 중복 데이터 문제가 종종 발생합니다. 특히, 사용자 목록의 중복 이름이나 문장의 중복 단어 등은 성능과 정확성을 해칠 수 있죠. 이번 포스트에서는 자바스크립트 배열과 문자열에서 중복 값을 제거하는 가장 효율적인 방법들을 알아보겠습니다.
배열의 중복 제거
배열은 중복을 좋아하지만, 우리에게 불편함을 줄 수 있습니다. 중복을 효과적으로 제거할 방법들을 살펴보겠습니다.
방법 1: Set 객체 사용
Set 객체는 중복을 허용하지 않는 자료 구조로, 가장 빠르게 배열의 중복을 제거할 수 있는 방법입니다.
const numbers = [1, 2, 2, 3, 4, 4, 5];
const uniqueNumbers = [...new Set(numbers)];
console.log(uniqueNumbers); // [1, 2, 3, 4, 5]
장점: 빠르고 효율적이며 간단하다. 단점: 원시값(문자열, 숫자, 부울)에만 사용할 수 있다.
방법 2: filter()와 indexOf() 사용
filter()와 indexOf()를 결합하여 배열의 중복을 제거할 수 있습니다.
const words = ["apple", "banana", "apple", "orange", "banana"];
const uniqueWords = words.filter((item, index) => words.indexOf(item) === index);
console.log(uniqueWords); // ["apple", "banana", "orange"]
장점: 원시값에 대해 작동한다. 단점: 큰 배열에서는 Set보다 느리다.
방법 3: reduce() 사용
reduce()는 많은 기능을 제공하는 유용한 도구입니다. 다만, 조금 어렵게 느껴질 수 있습니다.
const numbers = [1, 2, 2, 3, 4, 4, 5];
const uniqueNumbers = numbers.reduce((acc, curr) => {
if (!acc.includes(curr)) acc.push(curr);
return acc;
}, []);
console.log(uniqueNumbers); // [1, 2, 3, 4, 5]
장점: 출력에 대한 더 많은 제어가 가능하다. 단점: Set이나 filter()만큼 직관적이지 않다.
문자열의 중복 제거
문자열 처리에서는 문자나 단어의 중복을 제거해야 할 때가 있습니다.
방법 1: 문자를 대상으로 Set 사용
문자열을 배열로 변환하여 Set을 사용할 수 있습니다.
const str = "hello world";
const uniqueStr = [...new Set(str)].join("");
console.log(uniqueStr); // "helo wrd"
빠르고 쉽지만 공백도 제거되는 단점이 있습니다.
방법 2: 단어의 중복 제거
단어 중복 제거에서는 아래와 같은 방법이 유용합니다.
const sentence = "JavaScript is fun and JavaScript is powerful";
const uniqueSentence = [...new Set(sentence.split(" "))].join(" ");
console.log(uniqueSentence); // "JavaScript is fun and powerful"
단어 단위로 작동하지만 대소문자에 민감한 점을 염두에 두어야 합니다.
엣지 케이스 다루기
혼합 데이터 타입이 있는 배열에서 Set은 중복을 제거하지만 객체를 깊게 비교하지는 않습니다. 또한, "apple"과 "Apple"은 다르게 인식되며, 빈 배열이나 빈 문자열은 작업 전 확인이 필요합니다.
실생활에서의 응용
- 사용자 목록: 중복된 이름을 제거하여 사용자 가입 문제를 방지합니다.
- 검색 필터: 검색 쿼리가 고유한지 확인합니다.
- 데이터 정제: API 응답이나 데이터베이스에서 중복된 항목을 최소화합니다.
결론
중복 데이터는 피할 수 없는 혼란이지만, 이번에 배운 방법들은 이를 해결하는 데 큰 도움이 될 것입니다. 빠른 해결을 원한다면 Set을, 더 많은 제어가 필요하다면 filter()나 reduce()를 사용하세요. 성능을 염두에 두고 코드가 깨끗하게 유지되도록 하세요.