[JS] ES6+ 알아보기 : map & weakmap

[JS] ES6+ 알아보기 : map & weakmap

map 함수

기존의 배열을 순회하면서, 각각의 요소에 콜백 함수를 적용(실행)한 결과를 담은 새로운 배열을 만들어줌.

arr.map(callback(currentValue, index, array), thisArg);​

callback : 새로운 배열 요소를 생성하는 함수 currentValue : 처리하고자 하는 값 index : 처리하고자 하는 값의 인덱스 array : map() 을 호출한 배열

thisArg : callback 을 실행할 때 this 로 사용되는 값

배열의 각 요소에 대해 실행한 callback 결과가 적용된 새로운 배열을 반환함.

예제 코드

const arr = [1, 4, 9, 16]; const map = arr.map(x => x * 2); console.log(map); // [2, 8, 18, 32]

Map

기존의 Object 를 개선한 key-value 형태의 자료구조임.

Object 와 Map 의 차이점

[사용 가능한 key 타입]

Object : key 를 문자열로 취급함. → 다른 형태의 값은 문자열로 형변환됨. 그렇기 때문에 유니크함을 보장받지 못함.

const obj = { 1: 10, // 1 -> '1' 로 형변환됨. '1': 10 // 이미 '1'이 선언되어 있기 때문에 값이 덮어씌어짐. };

Map : 다양한 타입으로 key 를 정의할 수 있음. → 어떤 값이든 가능함.

const map = new Map([Iterable]); map.set(1, 10); map.get(1); // 10

[순회 : Iterable 여부]

Object : 반복 가능한 객체가 아님. 반복하고자 한다면 key 의 배열을 얻어 이 배열을 이용하여 순회해야 함.

Object.keys(obj).forEach(key => console.log(`key: ${key}, value: ${obj[key]}`));

Map : 반복(순회) 가능한 Iterable 객체임. → 삽입 순서를 기억하는 자료구조임.

map.forEach((value, key) => console.log(`key: ${key}, value: ${value}`));

[크기]

Object : 직접 판별해야 함.

Object.keys(obj).length

Map : size 속성을 이용하여 쉽게 얻을 수 있음.

map.size

Weakmap

Map 보다 비교적 약하게 참조하는 방식이라 볼 수 있음.

Map 은 객체를 key 로 사용한 경우, Map 이 메모리에 있는 한 객체도 메모리에 남음. 즉, 가비지 컬렉션의 대상이 되지 않음. WeakMap 에서는 key 로 사용된 객체가 가비지 컬렉션의 대상이 됨.

결과적으로 WeakMap 의 key 로 사용된 객체를 참조하는 것이 아무 것도 없다면 해당 객체는 메모리와 WeakMap 에서 자동으로 삭제됨.

특징

WeakMap 의 key 는 반드시 객체여야 함.

반복 작업과 keys() values() entries() 메서드를 지원하지 않음. 아래와 같은 메서드만 호출이 가능함. → key 나 value 전체를 얻는 것은 불가능함. 아래와 같은 메서드만 제공하는 이유는? 가비지 컬렉션의 동작 방식 때문임. WeakMap 에서의 객체는 모든 참조를 잃게 되면 자동으로 가비지 컬렉션의 대상이 됨. 하지만 가비지 컬렉션의 동작 시점은 정확히 알 수 없음. → 이는 자바스크립트 엔진이 결정함. 모든 참조를 잃었을 때, 그 즉시 메모리에서 삭제될 수도 있고, 다른 삭제 작업이 있을 때까지 대기하다가 함께 삭제될 수도 있음. 그렇기 때문에 WeakMap 에 요소가 몇 개 있는지 정확히 파악하는 것 자체가 불가능함. weakMap.get(key) weakMap.set(key, value) weakMap.delete(key) weakMap.has(key)

예제 코드

let person = { name: "jiwon", age: 24 }; let wm = new WeakMap(); wm.set(person, "비밀문서"); /* key : { name: "jiwon", age: 24 }, value : "비밀문서" -> person 이 사망하면 비밀문서는 자동으로 파기됨. */ person = null; // 참조를 덮어씀. 결과적으로 person 객체는 메모리에서 지워짐.

from http://leejiwonn.tistory.com/20 by ccl(A) rewrite - 2021-11-11 05:28:17