[ECMAScript]Set 객체

Set 객체는 ECMAScript 6부터 도입된 JavaScript 객체입니다.

 

Set 객체를 간단하게 설명하자면, 고유한 값을 가지는 객체입니다.

 

중복 값을 가지지 않고 정렬되지 않은 상태로 생성됩니다.

 

이번 포스팅에서는 Set 객체의 사용 방법을 정리합니다.

 

목차

1. Set 객체 생성 방법
2. Set 객체 다루기(요소의 개수, 추가, 삭제)
3. Set 객체의 요소를 반복문으로 접근하기
4. 부분집합, 합집합, 교집합, 차집합

---

Set 객체 생성 방법

빈 Set 객체를 생성합니다.

var setObject = new Set();

 

iterableObject(순회할 수 있는 객체)를 전달하여 Set 객체를 생성하는 방법입니다.

 

중복되는 값을 가지는 배열을 전달하여 중복 값을 가지지 않은 Set 객체를 생성합니다.

var setObject = new Set([1, 1, 2, 2, 3, 3]);

console.log(setObject);
// {1, 2, 3}

실행 결과

 

값이 정렬되지 않은 배열을 전달하면, Set 객체의 요소들도 정렬되지 않습니다.

 

즉, Set 객체는 자동으로 정렬하지 않습니다.

var setObject = new Set([3, 1, 2, 5, 4]);

console.log(setObject);
// {3, 1, 2, 5, 4}

실행 결과

 

배열의 요소가 객체인 배열을 전달하여 Set 객체를 생성합니다.

var objArr = [
  {
    company: 'Google'
  },
  {
    company: 'Apple'
  },
  {
    company: 'Facebook'
  }
]

var setObject = new Set(objArr);

console.log(setObject);

실행 결과

 

배열의 요소가 객체이며, 객체의 프로퍼티와 값이 중복되더라도 Set 객체에서 제거되지 않습니다.

var objArr = [
  {
    company: 'Google'
  },
  {
    company: 'Google'
  },
  {
    company: 'Facebook'
  }
]

var setObject = new Set(objArr);

console.log(setObject);

실행 결과

---

Set 객체 다루기

size 프로퍼티로 Set 객체 요소의 개수를 구할 수 있습니다.

var setObject = new Set([3, 1, 2, 5, 4]);

console.log(setObject.size);
// 5

 

add 함수로 Set 객체 마지막 위치에 요소를 추가할 수 있습니다.

메서드 체이닝을 사용하여 add 함수를 연결할 수 있습니다.

var setObject = new Set([3, 1, 2, 5, 4]);

console.log(setObject);
// {1, 2, 3, 4, 5}

// 맨 뒤에 6을 추가
setObject.add(6);

console.log(setObject);
// {1, 2, 3, 4, 5, 6}

// 메서드 체이닝을 사용
setObject.add(7).add(8);

console.log(setObject);
// {1, 2, 3, 4, 5, 7, 8}

 

delete 함수로 특정 값을 삭제할 수 있습니다.

delete 함수는 메서드 체이닝 사용 불가능합니다.

var setObject = new Set([1, 2, 3, 4, 5]);

console.log(setObject);
// {1, 2, 3, 4, 5}

// 5를 삭제
setObject.delete(5);

console.log(setObject);
// {1, 2, 3, 4}

 

claer 함수로 모든 값 삭제할 수 있습니다.

var setObject = new Set([1, 2, 3, 4, 5]);

console.log(setObject);
// {1, 2, 3, 4, 5}

// 모든 요소를 삭제
setObject.clear();

console.log(setObject);
// {}

---

Set 객체의 요소를 반복문으로 접근하기

forEach 함수로 Set 객체의 요소를 접근합니다.

배열의 forEach 함수와 사용방법이 다르므로 주의해서 사용합니다.

var setObject = new Set([1, 2, 3, 4, 5]);

console.log(setObject);
// {1, 2, 3, 4, 5}

setObject.forEach(function(item) {
  console.log(item);
});

실행 결과

 

for ... of 반복문을 사용하여 Set 객체의 요소를 접근할 수 있습니다.

var setObject = new Set([1, 2, 3, 4, 5]);

console.log(setObject);
// {1, 2, 3, 4, 5}

for (vr obj of setObject) {
    console.log(obj);
}

실행 결과

---

부분집합, 합집합, 교집합, 차집합

Set은 한글로 집합이며, 우리가 중, 고등학교 때 배웠던 그 집합 개념이 맞습니다.

Set 객체를 사용하여 부분집합, 합집합, 교집합, 차집합을 구할 수 있습니다.

부분집합을 판별하는 코드입니다.

Set 객체의 프로퍼티에 부분집합을 판별하는 subSet 이라는 함수를 생성합니다.

(함수의 이름은 마음대로 작성하셔도 됩니다.)

아래 코드는 subSet 함수에 전달된 Set 객체가 부분집합인지 아닌지 판별하는 코드입니다.

var setA = new Set([10, 20, 30, 40, 50]),
    setB = new Set([20, 30,]),
    setC = new Set([30, 40, 50, 60]);
    
// Set 객체의 프로퍼티에 부분집합을 판별하는 subSet 함수를 생성합니다.
// Set 객체를 인수로 받습니다.
Set.prototype.subSet = function(otherSet) { 
  // 집합이 같을 수도 있으므로 개수 체크합니다.
  // Why ? 두 집합이 같으면 부분 집합이 아니라 동일 집합입니다.
  if(this.size < otherSet.size) {
    return false;
  }
  else {
    for (var elem of otherSet) {
      if (!this.has(elem)) {
        return false;
      }
    }
  return true;
  }
}

console.log(setA.subSet(setB));
// true

console.log(setA.subSet(setC));
// false
  
console.log(setC.subSet(setB));
// false

합집합을 반환하는 방법입니다.

add 함수를 사용합니다.

add 함수를 사용하면, 중복 값은 추가되지 않기 때문입니다.

var setA = new Set([10, 20]),
    setB = new Set([30, 40, 50]);
    
// Set 객체의 프로퍼티에 합집합을 반환하는 union 함수를 생성합니다.
// Set 객체를 인수로 받습니다.
Set.prototype.union = function(otherSet) { 
  // 반환하는 Set 객체 입니다.
  var unionSet = new Set();
  
  // union 함수를 호출한 Set 객체의 요소를 반환하는 Set 객체에 추가합니다.
  for (var elem of this) {
    unionSet.add(elem);
  }
  
  // 인수로 받은 Set 객체의 요소를 반환하는 Set 객체에 추가합니다.
  for(var elem of otherSet) {
    unionSet.add(elem);
  }
  
  return unionSet;
}

console.log(setA.union(setB));

실행 결과

교집합을 반환하는 방법입니다.

intersection 함수를 실행한 Set 객체와 인수로 전달받은 Set 객체를 has 함수를 사용하여 동일한 요소가 있는지 체크합니다.

동일한 요소가 존재하면 반환하는 Set 객체에 추가합니다. 

var setA = new Set([10, 20, 30]),
    setB = new Set([30, 40, 50]);
    
// Set 객체의 프로퍼티에 교집합을 반환하는 intersection 함수를 생성합니다.
// Set 객체를 인수로 받습니다.
Set.prototype.intersection = function(otherSet) { 
  // 반환하는 Set 객체 입니다.
  var intersectionSet = new Set();
  
  for(var elem of this) {
    // has 함수를 사용하여 값이 존재하는지 체크 후 요소를 추가합니다.
    if(otherSet.has(elem))
      intersectionSet.add(elem);
  }
  
  return intersectionSet;
}

console.log(setA.intersection(setB));

실행 결과

차집합을 반환하는 방법입니다.

교집합을 반환하는 방법에서 if 문 조건을 반대로 합니다.

var setA = new Set([10, 20, 30]),
    setB = new Set([30, 40, 50]);
    
// Set 객체의 프로퍼티에 교집합을 반환하는 intersection 함수를 생성합니다.
// Set 객체를 인수로 받습니다.
Set.prototype.difference = function(otherSet) { 
  // 반환하는 Set 객체 입니다.
  var differenceSet = new Set();
  
  for(var elem of this) {
    // has 함수를 사용하여 값이 존재하는지 체크 후 요소를 추가합니다.
    if(!otherSet.has(elem))
      differenceSet.add(elem);
  }
  
  return differenceSet;
}

console.log(setA.difference(setB));

실행 결과