Computer >> 컴퓨터 >  >> 프로그래밍 >> JavaScript

자바스크립트 Set(집합)이란? 개념부터 활용법까지 총정리


Set(집합)이란?

Set은 ES6(ECMAScript 2015)에서 새롭게 도입된 객체 타입입니다. Set은 중복을 허용하지 않는 고유한 값들의 모음(collection)으로, 문자열이나 숫자 같은 원시 타입(primitive)뿐만 아니라 객체 리터럴이나 배열처럼 복잡한 객체 타입의 값도 저장할 수 있습니다.

문법

new Set([iterable]);

매개변수

iterable

iterable은 반복 가능한(iterable) 객체로, 이 객체의 요소들이 새로운 Set에 추가됩니다. 만약 iterable이 전달되지 않거나 null 값이 전달되면 빈 Set이 생성됩니다.

예제 1: 고유 값만 저장되는 Set

Set은 오직 고유한 값만 허용하기 때문에, 이미 존재하는 요소를 다시 추가하더라도 Set의 크기(size)는 변하지 않습니다. 아래 예제를 통해 직접 확인해 보겠습니다.

<html>
<body>
<script>
    var set1 = new Set(["a","a","b","b","c"]);// 고유 요소 수 - 3개(a, b, c)
    set1.add('c').add('d')                     // 두 개의 요소 추가(c, d)
    set1.forEach(alphabet => {                 // 총 7개 요소가 있지만 고유값은 4개뿐
    document.write(`alphabet ${alphabet}!`);
    document.write("</br>");
    });
    document.write(set1.size);                 // 4 출력 - Set은 고유한 값만 허용
</script>
</body>
</html>

출력 결과

alphabet a!
alphabet b!
alphabet c!
alphabet d!
4

예제 2: has() 메서드로 요소 존재 여부 확인

Set은 불리언(Boolean) 값도 반환할 수 있습니다. has() 메서드를 사용하면 특정 요소가 해당 Set 안에 존재하는지 검사한 뒤, 그 결과를 true 또는 false로 출력합니다.

<html>
<body>
<script>
    var set1 = new Set(["a","a","b","b","c"]);
    set1.add('c').add('d')
    set1.forEach(alphabet => {
    document.write(`alphabet ${alphabet}!`);
    document.write("</br>");
    });
    document.write(set1.has('a'));   // 'a'가 set1에 존재하므로 true 출력
    document.write("</br>");
    document.write(set1.has('8'));   // set1에 8이 없으므로 false 출력
    document.write("</br>");
    document.write(set1.size);       // 고유한 값만 허용되므로 고유값 개수인 4 출력
</script>
</body>
</html>

출력 결과

alphabet a!
alphabet b!
alphabet c!
alphabet d!
true
false
4

주요 Set 메서드 정리

  • add(value): Set에 새로운 값을 추가합니다.
  • has(value): 특정 값이 Set에 존재하는지 확인하여 true 또는 false를 반환합니다.
  • delete(value): Set에서 특정 값을 제거합니다.
  • clear(): Set의 모든 요소를 한 번에 제거합니다.
  • size: Set에 저장된 고유 요소의 개수를 반환합니다.

이처럼 Set은 중복 제거가 필요한 경우나 값의 존재 여부를 빠르게 확인해야 할 때 매우 유용하게 사용할 수 있는 자료구조입니다.