hash 관련 알고리즘 문제를 풀다 어떤분이 Map과 Set을 사용하신 것을 발견했다. Map과 Set에 대해서는 ES6 문법이다, 정도만 알고있었는데 실제로 사용할 수 있었다면 풀이가 더 쉬웠을 것 같았다. 그래서 다음번에는 사용해보기 위해 Map과 Set을 알아보기로!

Set()

Set은 value들로 이루어져있는 컬렉션이다.

• new Set()으로 새로운 set을 만든다.
• Set은 인덱스로 데이터를 조회할 수 없다.
• set.size set이 가지고 있는 데이터의 개수를 조회한다.
• set.has(value) value가 set안에 존재한다면 true를 반환한다.
• indexOf()로 데이터를 찾는것 보다 빠르다.
• set.add(value) value를 set에 추가한다.
• Set에는 같은 데이터가 2번 존재할 수 없어, 데이터가 이미 존재한다면 추가되지 않는다.
• set.delete(value) value를 set에서 제거한다.
• set.clear() set안의 모든 데이터를 삭제한다.
• set.keys(), set.values(), set.entries() 는 이터레이터들을 리턴하며, Map과의 호환성을 위해 존재한다.

var users = new Set();

users.add('Ceci'); 
users.add('Den')
console.log('users',users)  // Set ['Ceci', 'Den']

users.delete('Charles') //false => Set안에 존재하지않아 삭제할 수 없기 때문에 false 반환
users.delete('Ceci'); // true => Set안에 존재하는 값으로 삭제되었기 떄문에 true 반환

users.size //1 => Set의 길이를 반환 


users.has('Den') //true => Set안에 존재하는 값이기 때문에 true 반환 

users[0] // undefied => 인덱스로 값찾기 불가!

users.clear() //set데이터 모두삭제 

Map()

Map은 key-value의 쌍으로 이루어져있는 컬렉션이다.

• new Map() 으로 새로운 map을 만든다.
• map.set(key, value) map에 key와 value 를 추가한다. 같은 key값이 존재할 경우 기존 데이터를 덮어쓴다.
• map.get(key) key와 관련된 value를 리턴한다.
• map.has(key) key가 존재하는지 확인해 true, false를 반환한다.
• map.size map의 엔트리 개수를 조회한다.
• map.delete(key) key와 관련된 엔트리를 삭제한다.
• map.clear() map의 모든 데이터를 삭제한다.

let users = new Map();

users.set('name', 'Ceci') //추가, set은 같은 key가 존재하면 데이터를 덮어쓴다. 
users.set('nickname', 'devCecy') //추가

users.get('name') // 'Ceci' => key와 관련된 value를 리턴한다.  


users.has('name') // true => key가 존재하는지 확인한다.
users.size //2 => 엔트리의 개수를 반환한다.
users.clear() // 모든 데이터 삭제 

Map을 생성하는 3가지 방법

//1. 
let users = new Map();

//2.
let users = new Map([['age', '29']]); 

//3. 
let users = new Map().set('age', '29').set('phoneNumber', '01012345678')

Map.keys() 와 Map.values()

각각의 순회할 수 있는 모든 iterable object을 반환한다.

var users = new Map().set('name', 'Ceci').set('age', '29')

console.log([...users.keys()]) //[ 'name', 'age' ]
console.log([...users.values()]) //[ 'Ceci', '29' ]

Map 순회하는 2가지 방법

var users = new Map().set('age', '29').set('phoneNumber', '010')

//for-of
for (let [key, value] of users) {
  console.log(key + ':' + value); 
}


//forEach ** value - key 순임!!
users.forEach((value, key, map) => {
  console.log(key + ':' + value);
});

// 둘다 아래와 같은 결과가 반환된다.  
// 'age:29'
//'phoneNumber:010'

Map.entries()

map안의 모든 엔트리들을 순회할 수 있는 iterable object 반환한다.

let users = new Map().set('name', 'Ceci').set('age', '29')
let iterObj  = users.entries();
console.log('iterObj',iterObj) 
//'iterObj' Iterator [Map Iterator] {
//  __proto__: { next: ƒ next() }
//}

console.log(iterObj.next()) //{ value: [ 'name', 'Ceci' ], done: false }
console.log(iterObj.next()) //{ value: [ 'age', '29' ], done: false }
console.log(iterObj.next()) //{ value: undefined, done: true }()

iterable 개념에 대해 알보고 다시 모질라 블로그를 읽어보면 좋을것 같다.
의문점은 set.add()와, set.delete()는 set객체 자신을 리턴한다고 모질라 블로그에서 말하는데, 실제로 실행해보면 true,false값을 반환했다..!

Mozilla 블로그와 Kevin Hong님의 블로그를 보고 공부하며 작성했습니다.