ES6

8. Set, Map, WeakSet, WeakMap

으누아빠 2020. 7. 9. 20:17
반응형

Set, Map, WeakSet, WeakMap

Set

  • 중복이 허용되지 않으며 순서를 보장하는 값들로만 이루어진 리스트
  • 배열과 다르게 인덱스 개념이 없고 값으로 삭제하고 포함 여부를 확인
  1. .add: 객체에 주어진 값을 갖는 새로운 요소를 추가
  2. .delete: value와 관련된 요소를 제거
  3. .clear: 객체에서 모든 요소를 제거
  4. .has:객체 내 주어진 값을 갖는 요소가 있는지를 확인 후 boolean을 반환
let myArray = [11,22,33,44,55];
let mySet = new Set(myArray);

mySet.add('100');
console.log(mySet); // 결과값 Set { 11, 22, 33, 44, 55, '100' }

mySet.add({a:1, b:2});
console.log(mySet); // 결과값 Set { 11, 22, 33, 44, 55, '100', { a: 1, b: 2 } }

mySet.delete(22);
console.log(mySet); // 결과값 Set Set { 11, 33, 44, 55, '100', { a: 1, b: 2 } }

mySet.clear();
console.log(mySet); // 결과값 Set {}

mySet.add('100');
console.log(mySet.size); //  결과값 1

mySet.add('200');
console.log(mySet.size); //  결과값 2

mySet.forEach((val) => console.log(val));
//결과값
// 100
// 200
console.log(mySet.has('100')); //true
console.log(mySet.has('500')); //false

Map

  • [key, value] 쌍으로 이루어진 요소들의 집합
  • 순서를 보장
  • 키에는 어떤 데이터타입도 저장할 수 있음
  1. .set: 객체에 주어진 키(Key)에 값(Value)를 집어넣고, Map 객체를 반환
  2. .delete: 주어진 키(Key)와 해당되는 값(Value)를 제거
  3. .clear: 객체의 모든 key/value pair를 제거
  4. .has:객체 안에 주어진 key/value pair가 있는지 검사하고 Boolean 값을 반환
  5. .get:주어진 키(Key)에 해당되는 값(value)을 반환하고, 만약 없으면 undefined를 반환
const map = new Map()
map.set('name', 'kim')
map.set('age', 40)

console.log(map.size) // 결과값 2
console.log(map.get('name')) // 결과값 kim

map.delete('age')
console.log(map.has('name')) // 결과값 true
console.log(map.has('age')) // 결과값 false

map.clear();
console.log(map.size) // 결과값 0

let myMap = new Map([['a','Hello'],['b','Goodbye']]);
console.log(myMap); // 결과값 Map { 'a' => 'Hello', 'b' => 'Goodbye' }

myMap.set('c', 'Foo');
console.log(myMap); // 결과값 Map { 'a' => 'Hello', 'b' => 'Goodbye', 'c' => 'Foo' }

myMap.delete('a');
console.log(myMap); // 결과값 Map { 'b' => 'Goodbye', 'c' => 'Foo' }

console.log(myMap.size); //  결과값 2

WeakSet

  • Object만을 담을 수 있음
const foo = new WeakSet();
foo.add(10) // TypeError: Invalid value used in weak set
  • WeakSet은 메모리 누수를 방지
  • Set은 할당된 object 가 null 이 되더라도 메모리를 유지하나
  • weakSet 은 할당된 object 가 null 이 되면 메모리를 비우게 된다.

Set의 경우

const food = new Set();
let obj = { coffee: '아메리카노' };

food.add(obj);
console.log(food); //결과값 Set { { coffee: '아메리카노' } }

obj = null;
console.log(food); //결과값 Set { { coffee: '아메리카노' } }

WeakSet의 경우

const food = new WeakSet();
let obj = { coffee: '아메리카노' };

food.add(obj);
console.log(food);

// 결과값
// [{Entries}]
//     0:
//         value: {coffee:"아메리카노"}
const food = new WeakSet();
let obj = { coffee: '아메리카노' };

food.add(obj);
console.log(food);

// 결과값
// [{Entries}]
//     No properties

obj = null;
console.log(food);

// 결과값
// [{Entries}]
//     No properties

WeakMap

  • WeakMap은 객체를 담는다.
const foo = new WeakMap();
foo.set("key", "value"); //TypeError: Invalid value used as weak map key
let carWeakMap = new WeakMap();
let key1 = {
    id:1
}

let carWeak1 = {
  make: 'Hyundai',
  model: 'Palisade'
}

carWeakMap.set(key1, carWeak1);
console.log(carWeakMap);
// 결과값
// [{Entries}]
//     0: {Object => Object}
//         key: {id:1}
//         value: {make:"Hyundai", model:"Palisade"}

let key2 = {
    id:2
}

let carWeak2 = {
  make: 'Kia',
  model: 'K9'
}

carWeakMap.set(key2, carWeak2);
console.log(carWeakMap);

// 결과값
// [{Entries}]
//     0: {Object => Object}
//         key: {id:1}
//         value: {make:"Hyundai", model:"Palisade"}
//     1: {Object => Object}
//         key: {id:2}
//         value: {make:"Kia", model:"K9"}


carWeakMap.delete(key1);
console.log(carWeakMap);

// 결과값
// [{Entries}]
//     0: {Object => Object}
//         key: {id:2}
//         value: {make:"Kia", model:"K9"}
  • WeakMap은 메모리 누수를 방지

Map의 경우

const food = new Map();
let key = { country: 'korea' };
let obj = { coffee: '아메리카노' };

food.set(key,obj);
console.log(food); //결과값 Map { { country: 'korea' } => { coffee: '아메리카노' } }

key = null;
obj = null;
console.log(food); //결과값 Map { { country: 'korea' } => { coffee: '아메리카노' } }

WeakMap의 경우

const food = new WeakMap();
let key = { country: 'korea' };
let obj = { coffee: '아메리카노' };
food.set(key,obj);
console.log(food);
// 결과값
// [{Entries}]
//     No properties

key = null;
console.log(food);
// 결과값
// [{Entries}]
//     No properties

'ES6' 카테고리의 다른 글

10. async 와 await  (0) 2020.07.15
9. promise  (0) 2020.07.14
7. New String & Number Methods  (0) 2020.07.08
6. Template Literals  (0) 2020.07.08
5. classes 클래스  (0) 2020.07.07