map과 set

책 <러닝자바스크립트>를 기본으로 배운 자바스크립트 내용입니다.

 

목차

• <Map>
• 1. Map
• 1-1) Map vs Object
• 2. WeakMap
• 2-2) WeakMap vs Map
• <Set>
• 3. Set 

 

<Map>

1. Map

• Map 객체는 요소의 삽입 순서대로 원소를 순회한다. 
• for...of 반복문은 각 순회에서 [key, value]로 이루어진 배열을 반환한다.

const u1 = {name : 'jackson'}
const u2 = {name : 'olive'}

//맵 생성
const userRoles = new Map();

//맵의 set() 사용해 사용자 역할 할당
######
userRoles.set(u1, 'User')
userRoles.set(u2, 'Admin')
###또는###
userRoles
    .set(u1, 'User')
    .set(u2, 'Admin')
###또는### - 생성자에 배열의 배열을 넘기는 형태
const userRoles = new Map ([
    [u1, 'User']
    [u2, 'Admin']
]);

//맵 메소드
userRoles.has(u2);   - 맵에 키가 존재하는가
userRoles.get(u2);   - u2의 역할은 무엇인가
userRoles.set(u2, 'Users');    - 맵에 이미 존재하는 키의 값 교체
userRoles.size;    - 맵의 요소 숫자 변환
userRoles.delete(u2);   - 요소 삭제
userRoles.clear();      - 모든 요소 삭제

//맵 순환 하기
for (var key of userRoles.keys()) {
  console.log(key);
}

for (var value of userRoles.values()) {
  console.log(value);
}

for (var [key, value] of userRoles.entries()) {
  console.log(key + " = " + value);
}

 

1-1) Map vs Object

Object는 값에 키를 할당할 수 있고, 그 키로 값을 얻을 수 있고, 키를 삭제할 수 있으며 어떤 키에 값이 존재하는지 확인할 수 있다는 점에서 Maps와 유사함.

• Object의 키에는 String과 Symbol을 사용할 수 있지만, Map은 어떤 값도 사용 가능
• Map의 키는 삽입순으로 정렬되기 때문에 (Object의 키는 그렇지 않다.) Map을 순회하면 키를 삽입한 순서대로 반환한다.  하지만, Object를 순회하려면 어떤 방법이든 키의 배열을 얻고, 그 배열을 순회해야 한다.
• Map의 크기는 size 속성으로 쉽게 얻을 수 있지만 Object의 속성 수는 직접 판별해야한다.
• 잦은 키의 추가와 제거가 필요한 시나리오에서는 Map이 적합하다.

 

 

2. WeakMap

자바스크립트는 어딘가에 객체를 참조하려는 코드가 있다면, 그 객체를 메모리에 유지한다. 하지만 위크맵은 그렇지 않아 가비지 콜렉션 중인 객체를 노출할 가능성이 높다. 따라서 위크맵은 이터러블이 될 수 없다. 이러한 특징 때문에 위크맵은 객체 인스턴스 전용 키를 저장하기에 좋다.

const SecretHolder = (function () {
    const secrets = new WeakMap();
    return class {
        setSecret(secret){
            secrets.set(this, secret);
        }
        getSecret(){
            return secrets.get(this);
        }
    }
})();

const a = new SecretHolder();
const b = new SecretHolder();

a.setSecret('secret A');
b.setSecret('secret B');

console.log(a.getSecret());
console.log(b.getSecret());

WeakMap을 Map으로 사용해도 되지만, 그렇게 되면 SecretHolder 인스턴스에 저장된 내용은 가비지 컬렉션에 포함되지 않는다. (메모리에 계속 떠있게 된다는 것)

 

2-2) WeakMap vs Map

• WeakMap의 은 이터러블이 아니며, clear()이 없다.

 

<Set>

3. set 

• set은 객체는 값 콜렉션으로, 삽입 순서대로 요소를 순회할 수 있다. 하나의 Set 내 값은 중복을 허용하지 않는다.
• 셋의 장점은 추가하려는 것이 셋에 이미 있는지 확인하지 않아도 된다는 것이다. 이미 있으면 아무런 일도 일어나지 않는다.

//set 인스턴스 생성
const roles = new Set();

//set 메소드
roles.add("User");  - 사용자 역할 추가
roles.add("Admin"); - 위 사용자에게 관리자 역할 추가
roles.size; 
roles.delete("Admin")  - 역할 제거