본문 바로가기
javascript

자바스크립트 Set를 활용하여 중복을 제거하자!

by cactuslog 2024. 3. 7.

 

개념

 

- 자료구조에서의 Set란 순서가 없으며 중복되지 않은 데이터의 집합이다.

 

- 즉 Set는 동일한 요소가 존재할 수 없다.

 

- 배열은 데이터를 순서있게 저장하고 index를 통해 저장된 데이터에 접근한다.

 

- 배열에는 동일한 값을 다른 index에 여러 번 저장 가능하다.

 

- Set는 인덱스를 통해서 접근할 수 없다.

 

- 자바스크립트 Set는 ES6에 추가된 기능이다.

 

- 자바스크립트의 Set은 요소를 삽입한 순서대로 반복 할 수 있다.

 

 

 


 

어디에 사용하면 좋을까?

 

- 여러 상품 목록에서 추출한 키워드 리스트가 필요할 때, 배열 대신 Set에 저장한다면 중복을 제거할 수 있다.

 

- 사용자 ID, 이메일 주소 등 고유해야하는 값들을 관리할 때 사용할 수 있다.

 

 


 

 

Set 생성

- Set는 class이므로 new 키워드와 생성자를 사용하여 객체 생성

const set = new Set();
Set(0) {}

 

 

- 배열을 argument로 넘기면 배열에 넘긴 값 순서대로 객체 생성

const set = new Set(['a', 'b', 'c']);
Set(3) { 'a', 'b', 'c' }

 

 

- string을 넘기면 문자들을 중복 제거해서 생성

new Set('hello world')
Set(8) { 'h', 'e', 'l', 'o', ' ', 'w', 'r', 'd' }

 

 

Set를 배열로 전환

const setToArray = [...setA];
[ 'a', 'b', 'c' ]

 

값 추가

 

- add()는 값을 추가한 후에 Set 자신을 반환하기 때문에 chaining이 가능하다.

set.add('a');

set.add('a').add('b').add('c');

 

 

값 삭제

- 삭제 성공여부를 boolean으로 반환한다.

set.delete('a');

 

 

Set 순회

- 요소를 삽입한 순서대로 iterate(반복)할 수 있다.

for (const text of set) {
  console.log(text);
}

 

 

값 존재 확인

- 배열의 includes보다 성능면에서 우수하다.

set.has('c')

if (set2.has('c')) {
  console.log('has c');
}

 

 

set 요소 갯수

set.size

 

 

전체 제거

set.clear();

 

집합 연산

  • A 카테고리 인기 키워드 
  • B 카테고리 인기 키워드

A, B 카테고리에서 겹치는 키워드를 찾으려면?

 

const setA = new Set(['a', 'b', 'c']);
const setB = new Set(['c', 'd', 'a']);

const intersection = setA.intersection(setB);

console.log(intersection);
Set(2) {'a', 'c'}

 

 

nodejs에서는 아직 지원하지 않으므로 직접 구현해야한다.

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set/intersection