JavaScript - WeakMap 객체
안녕하세요, 미래의 자바스크립트 개발자 여러분! 오늘 우리는 자바스크립트의 흥미롭고 약간 신비한 부분으로 이동할 것입니다: WeakMap 객체. 프로그래밍에 새로운 사람이라면 걱정하지 마세요; 저는 이 개념을 단계별로 안내해 드리겠습니다. 수년 동안 수많은 학생들에게 가르쳐온 경험을 바탕으로 말이죠. 그러니 커피(또는 차, 그게 당신의 취향이라면요)를 한 잔 마시고, 이 WeakMap의 모험을 함께 시작해 보겠습니다!
WeakMap은 무엇인가요?
자세한 내용에 들어가기 전에, WeakMap이 무엇인지 이해해 보겠습니다. 마법의 상자를 상상해 보세요. 여기서 당신은 장난감을 보관할 수 있지만, 이 상자는 특별한 속성을 가지고 있습니다. 그것은 오직 객체만을 키로 받아들이며(문자열이나 숫자는 안됩니다!), 그리고 당신이 장난감을 놀리지 않는 동안 그 장난감을 잊어버리는 특별한 습관이 있습니다. 자바스크립트에서 WeakMap은 바로 이와 같습니다 - 오직 객체만을 키로 사용할 수 있는 컬렉션으로, 프로그램의 다른 곳에서 더 이상 필요로 하지 않을 때 객체가 가비지 컬렉션되도록 방지하지 않습니다.
문법
그렇다면 WeakMap을 어떻게 생성하고 사용할까요?
let myWeakMap = new WeakMap();간단하지 않나요? new WeakMap()을 호출하면, 마법의 상자가 준비되었습니다!
WeakMap 속성
이제 "와우, 이 WeakMap에서 어떤 속성을 접근할 수 있을까요?"라고 생각할 수도 있습니다. 그런데 WeakMap은 가비지 컬렉션의 특성상 인수 가능한 속성이 없습니다. 마법의 상자가 비밀을 쉽게 드러내지 않고 싶어하는 것 같아요. 하지만 걱정 마세요, 우리는 상호작용할 수 있는 메서드가 있습니다!
WeakMap 메서드
WeakMap은 강력한 메서드 세트를 제공합니다. 이를 편리한 표로 정리해 보겠습니다:
| 메서드 | 설명 |
|---|---|
| set(key, value) | 지정된 키와 값을 가진 새로운 요소를 추가합니다 |
| get(key) | 지정된 키와 연관된 값을 반환합니다 |
| has(key) | 지정된 키가 존재하는지 여부를 나타내는 불리언 값을 반환합니다 |
| delete(key) | 지정된 요소를 WeakMap에서 제거합니다 |
이 메서드들을 실제로 사용해 보겠습니다!
set(key, value)
let obj1 = {};
let obj2 = {};
let myWeakMap = new WeakMap();
myWeakMap.set(obj1, "Hello");
myWeakMap.set(obj2, "World");이 예제에서 우리는 WeakMap에 두 개의 키-밸류 쌍을 추가하고 있습니다. 주의해야 할 점은 우리가 객체(obj1와 obj2)를 키로 사용하고 있다는 것입니다. 만약 문자열이나 숫자를 키로 사용하려고 하면 자바스크립트가 빠르게 오류를 발생시킵니다!
get(key)
console.log(myWeakMap.get(obj1)); // 출력: "Hello"
console.log(myWeakMap.get(obj2)); // 출력: "World"여기서 우리는 객체 키와 연관된 값을检索하고 있습니다. 마법의 상자에게 "이 키로 저장한 장난감이 뭐야?"라고 물어보는 것과 같습니다.
has(key)
console.log(myWeakMap.has(obj1)); // 출력: true
console.log(myWeakMap.has({})); // 출력: falsehas 메서드는 클럽의 보안관처럼 동작합니다. 특정 객체 키가 WeakMap에 있는지 확인합니다. 이 경우 obj1은 허용되지만, 새로운 빈 객체 {}는 문을 나가야 합니다.
delete(key)
myWeakMap.delete(obj1);
console.log(myWeakMap.has(obj1)); // 출력: falsedelete 메서드를 사용하면 "이 장난감을 더 이상 놀리지 않겠다"고 WeakMap에게 알립니다. 제거 후 obj1은 더 이상 WeakMap에 없습니다.
WeakMap 생성자()
WeakMap 생성자는 키-밸류 쌍의 이터러블을 받아들일 수도 있습니다. 다음은 예제입니다:
let obj3 = {};
let obj4 = {};
let myWeakMap2 = new WeakMap([
[obj3, "Value 1"],
[obj4, "Value 2"]
]);
console.log(myWeakMap2.get(obj3)); // 출력: "Value 1"이는 마법의 상자에게 "이 장난감과 보관할 곳을 미리 알려주겠다"고 말하는 것과 같습니다.
예제
이제 기본 내용을 다루었으므로, WeakMap이 유용할 수 있는 실제 세계의 예제를 살펴보겠습니다.
예제 1: 사적인 데이터
WeakMap은 객체와 연관된 사적인 데이터를 저장하는 데 유용합니다:
let privateData = new WeakMap();
class Person {
constructor(name, age) {
privateData.set(this, { name: name, age: age });
}
getName() {
return privateData.get(this).name;
}
getAge() {
return privateData.get(this).age;
}
}
let john = new Person("John", 30);
console.log(john.getName()); // 출력: "John"
console.log(john.getAge()); // 출력: 30이 예제에서 우리는 Person 클래스에 대한 사적인 데이터를 저장하기 위해 WeakMap을 사용하고 있습니다. 데이터는 각 Person 인스턴스와 연관되지만, 클래스 메서드 외부에서 직접 접근할 수 없습니다.
예제 2: 캐싱
WeakMap은 메모리 누수를 일으키지 않고 계산된 결과를 캐싱하는 데 사용할 수 있습니다:
let cache = new WeakMap();
function expensiveOperation(obj) {
if (cache.has(obj)) {
console.log("캐싱된 결과 반환");
return cache.get(obj);
}
let result = /* ... 비싼 계산 수행 ... */;
cache.set(obj, result);
return result;
}
let obj = {};
expensiveOperation(obj); // 계산 수행
expensiveOperation(obj); // 캐싱된 결과 반환이 예제에서 우리는 비싼 연산의 결과를 캐싱하기 위해 WeakMap을 사용하고 있습니다. 특정 객체에 대해 연산이 이미 수행된 적이 있다면, 캐싱된 결과를 반환합니다.
결론
그렇습니다, 여러분! 자바스크립트의 신비한 세계인 WeakMap을 탐구했습니다. 그 독특한 키 요구 사항에서부터 가비지 컬렉션 친화적인 성질까지, WeakMap은 특정 사용 사례에서 강력한 도구를 제공합니다.
WeakMap은 사람의 얼굴만 기억하고 이름은 잊어버리는 이상한 친구처럼, 모든 상황에 적합하지는 않지만, 필요할 때는 귀중합니다.
자바스크립트 여정을 계속하면서 WeakMap을 도구箱에 넣어 두십시오. 언제 필요할지 몰라도, 사적인 데이터를 저장하거나 메모리 누수를 일으키지 않는 캐시를 만들 때 유용할 것입니다. 행복한 코딩을 기원하며, WeakMap이 항상 영혼이 강하길 바랍니다!
Credits: Image by storyset