[자바스크립트] Set 자료구조

Set

자바스크립트의 Set 자료구조는 Map과 함께 ES6에서 추가된 자료구조이다. Map이 객체와 유사하지만 차이점이 있었다면, Set은 배열과 유사하지만 차이점이 존재하는 자료구조이다.

 

흔히, Set 자료구조는 순서있는 데이터의 집합인 배열과는 달리 순서가 없는 중복되지 않은 데이터의 집합이다. 이러한 차이점이 존재하다 보니, Set 또한 Map처럼 상황에 따라, 배열보다 유용할 때가 있고 굳이 세트를 사용할 필요가 없는 경우가 있다. 

 

Set 를 배열과는 비교를 하긴 하지만, 사실 배열과는 결이 많이 다른 자료구조이다. 배열은 데이터를 순서있게 저장하여 인덱스를 통해 접근할 수 있고 중복된 값 또한 허용한다.

 

하지만, Set는 데이터를 순서없이 저장하며 그렇기 때문에 인덱스를 통해 접근할 수 없고, 중복된 데이터 또한 허용하지 않는다. 이러한 특징을 토대로 Set를 어떻게 사용하는지 알아보도록 하자.

 

 

 

Set 생성

자바스크립트에서 Set는 new 키워드와 생성자를 사용하여 객체를 생성할 수 있다. (리터럴 방식은 없음 ) 

// new Set()
// 빈 Set
let set = new Set();
console.log(set); // Set(0) {}

// 생성자에 초기값 넘겨주기
// 배열을 인수로 받음
set = new Set([1, "js", true]);
console.log(set); // Set(3) { 1, 'js', true }

// 중복된 값 허용X
set = new Set([1, "js", true, 1, true]);
console.log(set); // Set(3) { 1, 'js', true }

 

객체 생성시 값을 초기화하기 위해서는 생성자의 인수로 배열을 넘겨주면 된다. 또한 위의 코드에서처럼, 중복된 값을 넣어도 허용하지 않는 것을 알 수 있다.

 

 

 

Set 메소드

Set은 순서가 없는 중복되지 않은 데이터의 집합이기 때문에, 값을 추가하고 삭제하고 존재하는지 확인하는 것은 가능하지만 인덱스 또는 메소드를 통해 값을 불러오거나 수정하는 것은 불가능하다.

 

add(value)

세트에 새로운 값을 추가할 때 사용하는 메소드이다. 중복된 값은 추가되지 않으며, 유일한 값만 추가된다.

const set = new Set();

// add(value) : 값 추가
set.add(1);
set.add(true);
set.add("javascript");

console.log(set);  // Set(3) { 1, true, 'javascript' }

// 중복된 값 추가 안됨
set.add(1);
set.add("javascript");

console.log(set);  // Set(3) { 1, true, 'javascript' }

 

add 메소드는 반환 값으로, 값이 추가된 set 객체를 반환하기 때문에 add 메소드를 체이닝하여 사용할 수 있다.

const set = new Set();

// add(value) <= 체이닝 가능
set.add(1).add(true).add("javascript");

console.log(set);  // Set(3) { 1, true, 'javascript' }

 

 

delete(value)

Set 안에 있는 값을 삭제하는 메소드이다. 성공적으로 값을 삭제하면 true를 리턴하고, 세트 안에 값이 존재하지 않아 삭제하지 못하면 false를 리턴한다.

const set = new Set([1, true, "javascript"]);
console.log(set);  // Set(3) { 1, true, 'javascript' }

// delete(value)
// 성공 : true / 실패 : false
if(set.delete(true)) {
  console.log("delete succeeded"); // delete succeeded
}

if(!set.delete(2)) {
  console.log("delete failed"); // delete failed
}

 

 

has(value)

Set 내에 해당 값이 존재하는지 여부를 확인하는 메소드이다. 존재하면 true를 존재하지 않으면 false를 리턴한다.

const set = new Set([1, true, "javascript"]);
console.log(set);  // Set(3) { 1, true, 'javascript' }

// has(value)
// 존재O : true / 존재X : false
let value = 1;
set.has(value) ? set.delete(value) : console.log(`Set doesn't have the value : ${value}`);

value = false;
set.has(value) ? set.delete(value) : console.log(`Set doesn't have the value : ${value}`);
// Set doesn't have the value : false

 

 

clear()

Set 객체의 모든 값을 제거하는 메소드이다.

const set = new Set([1, true, "javascript"]);
console.log(set);  // Set(3) { 1, true, 'javascript' }

// clear()
// 모든 값 제거
set.clear();
console.log(set);  // Set(0) {}

 

 

 

Set 순회

Set는 배열처럼 for-of 문을 사용하여 순회할 수 있다.

const set = new Set([1, true, "javascript"]);
console.log(set);  // Set(3) { 1, true, 'javascript' }

// for-of로 순회 가능!!
// for-of 돌면서 요소 다 삭제해보기
for(const val of set) {
  set.delete(val);
}

console.log(set);  // Set(0) {}

 

Set도 Map 자료구조와 같이 forEach 메소드를 내장함수로 제공한다.

const set = new Set([1, true, "javascript"]);
console.log(set);  // Set(3) { 1, true, 'javascript' }

set.forEach(el => console.log(el));  // 1 true javascript

 

 

 

Set <=> 배열

배열 => Set

배열을 Set로 변환하는 방법은 간단하다. 바로 배열을 Set 생성자의 인수로 넘겨주면 된다.

const array = [1, 2, 3, 3, 4, 2, 1];

const set = new Set(array);
console.log(set);  // Set(4) { 1, 2, 3, 4 }

 

위의 결과에서 볼 수 있듯이, 배열로 세트를 만들어내면 중복값이 모두 제거되기 때문에 중복 값을 유지해야 하는 상황에서는 배열을 세트로 만들면 안된다!!

 

 

Set => 배열

Set를 배열로 변환하는 방법에는 몇 가지가 있는데, 그 중 가장 간단한 방법은 전개 연산자를 사용하는 방법이다. 

const set = new Set().add(1).add(true).add("javascript");

const array = [...set];
console.log(array);  // [ 1, true, 'javascript' ]


// 전개 연산자가 가능하다는 말은?
// 구조 분해 할당도 가능
// 크게 유용하진 않겠지만...
const [val1, val2, val3] = [...set];
console.log(val2);

 

또는 Array 객체의 정적 메소드인 from을 사용하면 set 객체를 배열로 변환할 수 있다.

const set = new Set().add(1).add(true).add("javascript");

const array = Array.from(set);
console.log(array);  // [ 1, true, 'javascript' ]

 

 

 

Set의 활용

중복을 허용하지 않는 Set의 특징과 적절한 메소드를 이용하면 중복되지 않는 배열 집합의 집합 연산을 구현할 수 있다.

const set1 = new Set([1, 2, 3, 4, 5]);
const set2 = new Set([4, 5, 6, 7, 8]);

// 합집합
const union = new Set([...set1, ...set2]);
console.log([...union]); // [1, 2, 3, 4, 5, 6, 7, 8]

// 교집합
const intersection = new Set([...set1].filter((value) => set2.has(value)));
console.log([...intersection]); // [4, 5]

// 차집합
const difference = new Set([...set1].filter((value) => !set2.has(value)));
console.log([...difference]); // [1, 2, 3]