[JS] Set 사용하기

2024. 6. 12. 22:25Front-end/JavaScript

반응형

Set는 순서가 없는 중복되지 않은 데이터들의 집합이다.

 

배열과 비슷해 보일 수 있지만 다른 자료구조이다.

  • 배열은 동일한 값을 포함할 수 있지만 Set의 값은 한 번만 나타날 수 있다.
  • 배열은 요소 순서에 의미가 있지만 Set은 요소 순서에 의미가 없다.
  • 배열은 인덱스로 요소에 접근할 수 있지만 Set은 인덱스로 요소 접근이 불가능하다.

Set 객체 생성하기

Set 객체는 Set 생성자 함수를 통해 만들 수 있다.

const set = new Set(); // Set(0)

위와 같이 인수를 전달하지 않으면 빈 Set 객체가 생성된다.

 

Set 생성자 함수는 이터러블을 인수로 받는다.

이때, 중복된 값은 요소에 저장되지 않기 때문에 배열에서 중복된 요소를 제거하는 데 사용할 수 있다.

const set1 = new Set([1,2,3,4,5)]; // Set(5) {1, 2, 3, 4, 5}
const set2 = new Set([1,2,3,3]); // Set(3) {1, 2, 3}
const set3 = new Set('aaabbc'); // Set(3) {'a', 'b', 'c'}

 

요소 추가

Set 객체에 요소를 추가하려면 add() 메서드를 사용한다.

add() 메서드는 값을 추가한 후 Set 객체를 반환하기 때문에 연쇄적으로 호출이 가능하다.

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

set.add(1); // Set(1) {1}
set.add(2).add(3) // Set(3) {1, 2, 3}

 

요소 삭제

Set 객체에서 요소를 삭제하려면 delete() 메서드를 사용한다.

삭제 성공 여부를 나타내는 불리언 값을 반환한다.

const set = new Set([1, 2, 3]);

set.delete(2); // true
console.log(set) // Set(2) {1, 3}

set.delete(0); // false
console.log(set) // Set(2) {1, 3}

 

요소 일괄 삭제

Set 객체에서 모든 요소를 삭제하고 싶다면 clear() 메서드를 사용한다.

clear 메서드는 언제나 undefined를 반환한다.

const set = new Set([1, 2, 3, 4]);

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

 

요소 개수 확인

Set 객체의 요소 개수는 size 속성을 통해 알 수 있다.

const set1 = new Set([1, 2, 3, 4]);
console.log(set1.size); // 4

const set2 = new Set([1, 2, 3, 3]);
console.log(set2.size); // 3

 

요소 존재 여부 확인

Set 객체에 특정 요소가 존재하는지 확인하려면 has() 메서드를 사용한다.

const set = new Set([1, 2, 3, 4]);

console.log(set.has(1)); // true
console.log(set.has(0)); // false

 

요소 순회

Set 객체에 저장되어있는 모든 값을 순회하고 싶을 때는 아래와 같이  사용할 수 있다.

const set = new Set([1, 2, 3]);

for (const value of set) {
	console.log(value)
} // 1 2 3

set.forEach((value) => console.log(value)); // 1 2 3

 

배열을 Set로 변환

배열을 Set로 변환하기 위해선 Set의 생성자에 배열을 넘기면 된다.

const arr = [1, 2, 3, 3, 4];
const set = new Set(arr) // Set(4) {1, 2, 3, 4}

이때, 배열의 중복된 값이 Set로 변환되며 제거된다.

 

Set를 배열로 변환

Set를 배열로 변환하기 위해선 Array.from()함수 혹은 전개 연산자를 사용하면 된다.

const set = new Set([1, 2, 3]);

const arr1 = Array.from(set); // [1, 2, 3]
const arr2 = [...set]; // [1, 2, 3]

 

 

반응형