본문 바로가기

침착하게 Study/Javascript

[Javascript] Set 객체란? new Set() 예제 정리 및 간단 설명

Set 객체 

기본적으로 Set 객체는 value 들로 이루어진 하나의 컬랙션이다.  삽입 순서대로 요소를 조회 할 수 있고,  Array와는 다르게 같은 value를 2번 포함할 수 없다. 즉, 중복된 값을 가지지 않는다. 그래서 Array의 값들중에 중복을 제거 하기 위해서 Set 객체로 변환하면, 중복된 값을 제외한 배열을 얻을 수가 있다. 

 

Set 기본 문법

var newSet  = new Set(); 

 

Set  기본 인스턴스 속성들 

  1. Set.prototype.add(value)
    • Set 객체에 value를 넣어준다. 추가된 value가 있는 Set 객체를 반환한다. 
  2. Set.prototype.clear()
    • Set 객체에 있는 모든 value를 제거 한다.
  3. Set.prototype.delete(value)
    • value값하고 관련된 요소를 제거한다. 제거가 성공적으로 되던지 안된던지 간에 논리 값을 리턴한다.    (TRUE/FALSE)
  4. Set.prototype.has(value)
    • 현재 주어진 value값이 Set 객체에 있든지 없던지간에 논리값을 리턴한다.(TRUE/FALSE)

 

Set 객체 사용 예제

 

Set 객제 기본 문법 사용 예제

let testSet = new Set();

//숫자형 Set 객체에 add , 중복으로 넣어도 값은 하나 
testSet.add(1); 
testSet.add(1); 
//문자형 Set 객체에 add 
testSet.add("suzie");

//object Set 객체에 add 
const obj = {"a":1,"b":2};
testSet.add(obj);


//testSet Set(3)) {1, 'suzie', Object {a: 1, b: 2}}
console.log("testSet",testSet);
console.log("testSet.size :: ",testSet.size);

// "hasTest1 :: ", true
const hasTest1 = testSet.has(1);
console.log("hasTest1 :: ",hasTest1);

//"hasTest2 :: ", false
const hasTest2 =  testSet.has(5);
console.log("hasTest2 :: ",hasTest2);

// delete 
testSet.delete('suzie');
const deleteTest = testSet.has('suzie');
//"testSet.size :: ", 2
console.log("testSet.size :: ",testSet.size);

// clear
testSet.clear();
//"testSet.size :: ", 0
console.log("testSet.size :: ",testSet.size);// 코드작성

 

Set 객체 반복

// 순서대로 항목을 (콘솔에) 기록: 1, "suzie", {"a": 1, "b": 2}
for (let item of testSet) console.log(item);

// 순서대로 항목을 (콘솔에) 기록: 1, "suzie", {"a": 1, "b": 2}
for (let item of testSet.keys()) console.log(item);

// 순서대로 항목을 (콘솔에) 기록: 1, "suzie", {"a": 1, "b": 2}
// (여기서 key와 value는 같음)
for (let [key, value] of testSet.entries()) console.log(key);

// Set 객체를 배열 객체로 변환(Array.from으로)
const testArr = Array.from(testSet);
 console.log(testArr); // [1, "suzie", { a: 1,b: 2}]
 
// Set과 Array 사이 변환
testSet2  = new Set([1,2,3,4]);
console.log(testSet2.size);  // 4
console.log([...testSet2]); //[1, 2, 3, 4]


// Set으로 집합을 표현 가능 
let set1 =  new Set();
set1.add(1);
set1.add(2);
set1.add(3);
set1.add(4);
let set2 = new Set();
set2.add(1);
set2.add(3);
set2.add(4);
set2.add(6);

// 교집합은 다음으로 흉내 가능
const intersection = new Set([...set1].filter(x=>set2.has(x)));
console.log("intersection : ",intersection); //intersection :  Set(3) {1, 3, 4}

// 차집한은 다음으로 흉내 가능 
const difference  = new Set([...set1].filter(x=> !set2.has(x)));
console.log("difference : ", difference); // difference :  Set(1) {2}

// forEach로 set 항목 반복 
testSet2.forEach(function(value){
	console.log("forEach : "+ value);
  /*
"forEach : 1"
"forEach : 2"
"forEach : 3"
"forEach : 4"
  */
});

 

Set 객체로 기본 집학 연산 구현

 

// superset인지 아닌지 확인 
Set.prototype.isSuperset = function(subset){
	for(var elem of subset){
  	if(!this.has(elem)){
    	return false;
    }
  }
  return true;
}

// 합집합 
Set.prototype.union = function(setB){
	var union = new Set(this);
  for(var elem of setB){
  	union.add(elem);
  }
  return union;
}

// 교집합 
Set.prototype.intersection = function(setB){
	var intersection = new Set();
  for(var elem of setB){
  	if(this.has(elem)){
    	intersection.add(elem);
    }
  }
  return intersection;
}

// 차집합
Set.prototype.difference = function(setB){
	var difference = new Set(this);
  for(var elem of setB){
  	difference.delete(elem);
  }
  return difference;
}


// 예시 
var setA = new Set([1,2,3,4,5]),
    setB = new Set([1,5]),
    setC = new Set([3,4,5]);
    
    
setA.isSuperset(setB); //true
setA.union(setC); //Set(5) {1, 2, 3, 4, 5}
setA.intersection(setB); // Set(3) {3, 4, 5}
setA.difference(setC); // Set(2) {1, 2}

 

Set 객체로 Array 객체안에 중복된 값 제거 가능

var myArray = ['value1', 'value2', 'value3', 'value3'];

// Array를 Set으로 변환하기 위해서는 정규 Set 생성자 사용
var mySet = new Set(myArray);


console.log([...mySet]); // ["value1", "value2", "value3"] 중복된 값 제거됨.

 

Set 객체 설명

 

참고 |

https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Set

 

Set - JavaScript | MDN

Set 객체는 자료형에 관계 없이 원시 값과 객체 참조 모두 유일한 값을 저장할 수 있습니다.

developer.mozilla.org