[JS] Set | 객체가 들어있는 배열에서 중복되는 값을 지워줘~
- 프론트/자바스크립트
- 2024. 8. 2.
💡 Set 완전 100% 리얼 기초 문법 보기
이전에 Set을 이용해서 배열의 중복되는 값을 제거하는 방법을 알아봤지만 사실 개발하다보면 저런 단순한 1차원 배열에 값만 띡띡 들어있는 데이터보다 조금 더 복잡한 형태의 데이터를 다루는 일이 많다. (아마도)
예를 들어 .. JSON으로 데이터를 처리할 때 대충 이렇게 생긴 것들을 흔히 볼 수 있는데 Set은 객체 형태의 데이터까지는 중복제거를 하지 못한다. (진짜임 궁금한 사람들은 한번 해보세요 되나 안되나)
const obj = [
{
id: 1,
name: "홍길동",
age: 123,
},
{
id: 2,
name: "이황",
age: 123,
},
{
id: 1,
name: "홍길동",
age: 123,
},
]
그럼에도 불구하고 Set으로 저런거 중복 제거하기
보통 위와 같은 형태의 데이터는 고유해야하는 `id값`이 있을 것이다. 없으면 다른거 아무거나 고유해야하는 아무 속성을 기준으로 하면 된다. 일단 예시 코드는 중복된 `id값`을 기준으로 중복 제거를 해보았다.
// 중복된 값이 있는지 비교해줄 Set
const set = new Set();
// filter()로 조건에 맞는(중복이 아닌) data만 newObj에 반환하기
const newObj = obj.filter(item => {
// set.has(): set에 값이 있는지 확인 (true | false)
const duplicate = set.has(item.id);
// set.add(): set에 id값 넣어주기(어차피 중복 제거해줘서 일단 넣으면됨)
set.add(item.id);
// 중복되는 값이 있었으면 (!true) => 반환하지 말어라
return !duplicate;
})
console.log(newObj); // 출력 : 직접 해보셈
'프론트 > 자바스크립트' 카테고리의 다른 글
[JS] 매개변수 배열로 묶어서 받기 | Rest 문법 (0) | 2024.08.13 |
---|---|
[JS] 매개변수가 많아질 때 고민 | 구조 분해 할당 #객체편 (0) | 2024.08.09 |
[JS] Set | 배열에서 중복되는 값 지워줘~ (0) | 2024.08.01 |
[JS] Class | 클래스 정의와 특징 #기초편 (0) | 2024.07.31 |
[JS교양] 상황에 따라 달라지는 this (0) | 2024.07.29 |