🔵 내용요약

set

set객체는 중복되지 않는 유일한 값들의 집합
수학적 집합을 구현하기(교집합, 합집합) 위한 자료 구조이다.

🕵️ 배열과 유사 하지만 차이가 있다

• 동일한 값을 중복하여 포함할수 없다

• 요소순서에 의미가 없다

• 인덱스로 요소에 접근할수 없다.

  
  

1. set 생성자 함수로 생성한다.

• 인수를 전달하지 않으면 빈 set객체가 생성된다.
• 중복된 값은 set객체에 요소로 저장되지 않는다.

 const set = new Set();
 console.log(set) //Seet(0) {}

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

2. set.prototype.size

• Set 객체의 요소 개수 확인 가능
• size 프로퍼티는 setter 함수없이 getter 함수만 존재하는 접근자 프로퍼티이다.
• size 프로퍼티에 숫자를 할당하여 Set 객체의 요소 개수를 변경할 수 없다.

3. set.prototype.add

• 객체에 요소를 추가할 때 사용

const set1 = new Set();
console.log(set) //Seet(0) {}

set.add(1);
console.log(set); //Set(1) {1}

• add 메서드는 새로운 요소가 추가된 Set 객체를 반환한다.
• add 메서드를 호출한 후에 add 메서드를 연속적으로 호출 할 수 있다.

const set = new Set();

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

• Set 객체에 중복된 요소의 추가는 허용되지 않는다. 이때 에러가 발생하지는 않고 무시된다.

• 일치 비교 연산자를 사용하면 NaN과 NaN을 다르다고 평가한다. 하지만 Set 객체는 NaN과 NaN을 같다고 평가하여 중복 추가를 허용하지 않는다. +0과 -0은 일치 비교 연산자와 마찬가지로 같다고 평가하여 중복 추가를 허용하지 않는다.

const set = new Set();

console.log(NaN === NaN); //false 
console.log(0 === -0); //true 

set.add(NaN).add(NaN) //NaN과 NaN을 같다고 평가하여 중복 추가를 허용하지 않는다. 
console.log(set) //Set(1) {NaN}

• Set 객체는 객체나 배열과 같이 자바스크립트의 모든 값을 요소로 저장할 수 있다.

4. set.prototype.has 프로퍼티를 사용

set 객체에 특정 요소가 존재하는지 확인하기 위해 사용
불리언 값을 반환

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

console.log(set.has(2)); //true
console.log(set.has(4)); //false  

5. set.prototype.delete

• 특정요소를 삭제하기 위해 사용하며 불리언 값을 반환한다.
• 삭제하려는 요소값을 인수로 전달해야한다. (인덱스 x)
• 존재하지 않는 set 객체의 요소 삭제하려 하면 에러 없이 무시된다.
• 연속적으로 호출할 수는 없다.

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

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

6. set.prototype.clear

• 객체의 모든 요소를 일괄 삭제
• clear메서드는 언제나 undefined를 반환한다.
  

7. 요소 순회

• set 객체의 요소를 순회하려면 set.prototype.forEach 메서드를 사용한다.
• set 객체는 이터러블이라서 for...of 문으로 순회할 수 있다. 스프레드 문법과 배열 디스트럭처링의 대상이 될수도 있다.
• this로 사용될 객체를 인수로 전달한다.

map

객체는 키와 값이 쌍으로 이루어진 컬렉션이다.

🕵️ 객체와 유사하지만 차이가있는데

• 키로 사용할수 있는 값이 객체를 포함한 모든 값
• 이터러블 o
• 객체는 문자열 또는 심벌 값만 키로 사용할수 있다. 하지만 Map 객체는 키 타입에 제한이 없다. 따라서 객체를 포함한 모든 값을 키로 사용할 수 있다. 이는 Map 객체와 일반 객체의 가장 두드러지는 차이점이다.

1. map 생성자 함수로 생성한다.

• map 생성자 함수에 인수를 전달하지 않으면 빈 map 객체가 생성된다.
• 인수로 전달되는 이터러블은 키와 값의 쌍으로 이루어진 요소로 구성되어야 한다.

 const map1 = new Map([['key1','value1'],['key2','value2']])
 
 console.log(map1)// map(2) {'key1' => 'value1', 'key2' =>'value2'}

2. Map.prototype.size 프로퍼티

• 요소 개수를 확인할 수 있다.
• size 프로퍼티에 숫자를 할당해 map 객체의 요소 개수를 변경 할 수 없다.

3. Map.prototype.set

• 객체에 요소 추가

const map = new Map();
console.log(map) // Map(0) {}

map.set('key1','value1');
console.lgo(map) // Map(1) {'key1
'=>'value1'}

• set 메서드는 새로운 요소가 추가된 Map 객체를 반환한다. 따라서 set 메서드를 호출한 후에 set 메서드를 연속적으로 호출 할 수 있다.
• 중복된 키를 갖는 요소 추가시 값이 덮어 써진다.
• map 생성자 함수의 인수로 전달한 이터러블에 중복된 키를 갖는 요소가 존재하면 값이 덮어써진다. 따라서 map 객체에는 중복된 키를 갖는 요소가 존재할수 없다.
• 일치 비교 연산자를 사용하면 NaN과 NaN을 다르다고 평가한다. 하지만 map 객체는 NaN과 NaN을 같다고 평가하여 중복 추가를 허용하지 않는다. +0과 -0은 일치 비교 연산자와 마찬가지로 같다고 평가하여 중복 추가를 허용하지 않는다.

4. Map.prototype.get 메서드를 사용한다.

map 객체에서 특정 요소를 취득

const map = new Map();
const lee = {name:'Lee'};
const Kim = {name:'Kim'};

map
	.set(lee, 'developer')
    .set(kim, 'designer')
    
console.log(map.get(lee)); //developer

5. map.prototype.has

객체에 특정 요소가 존재하는지 확인

const lee = {name : 'Lee'};
const Kim = {name: 'kim'};

const map = new Map([[lee, 'developer'], [kim, 'designer']])

console.log(map.has(lee)); //true

5. map.prototype.delete

• 객체의 요소를 삭제할때 사용 불리언 값을 반환한다.

6. map.prototype.clear

• 객체 요소 일괄 삭제 clear 메서드는 언제나 undefined 를 반환한다.

7.요소 순회

• map 객체의 요소를 순회하려면 Map.prototype.forEach 메서드 사용
• 이터러블이라서 for...of 문으로 순회할 수 있다. 스프레드 문법과 배열 디스트럭처링의 대상이 될수도 있다.

🔵 느낀점

Map 키-값 관계가 필요하거나 데이터의 삽입 순서를 유지해야 할 때. Set: 고유한 값만 저장하거나 중복 제거, 집합 연산이 필요한 경우. 사용하면 이점을 얻을 수 있다고 한다. Map과 Set은 비슷한 메서드를 가지고 있으며, 사용법도 유사한점이 많다. 그러나 두 자료구조의 특성에 따라 메서드의 목적과 작동 방식이 다르다.