WeakMap, Map และ Set ใน JavaScript ความแตกต่างและการใช้งาน
WeakMap คืออะไร?
WeakMap เป็นโครงสร้างข้อมูลประเภทหนึ่งใน JavaScript ที่มีลักษณะคล้าย Map แต่มีความแตกต่างสำคัญในเรื่องของการจัดการหน่วยความจำ โดยเฉพาะอย่างยิ่งการทำงานร่วมกับ Garbage Collector (GC) ซึ่งทำให้ WeakMap มีพฤติกรรมที่แตกต่างจาก Map ทั่วไป
เปรียบเทียบ WeakMap กับ Map
| คุณสมบัติ | Map |
WeakMap |
|---|---|---|
| ประเภทของคีย์ | สามารถใช้ Primitive และ Object ได้ | คีย์ต้องเป็น Object เท่านั้น |
| การเข้าถึงค่า | ใช้ .get(key), .set(key, value) ได้ |
ใช้ .get(key), .set(key, value) ได้ |
ขนาด (size) |
มี .size ไว้ดูจำนวนสมาชิก |
ไม่มี .size |
| การวนลูป | ใช้ .forEach() หรือ Iterators (keys(), values(), entries()) ได้ |
ไม่สามารถวนลูปได้ |
| การจัดการหน่วยความจำ | คีย์ยังคงอยู่แม้ไม่มี reference | คีย์ถูก garbage collected ทันทีเมื่อไม่มี reference |
ลบค่า (delete) |
✅ มี .delete(key) |
✅ มี .delete(key) |
ล้างทั้งหมด (clear) |
✅ มี .clear() |
❌ ไม่มี .clear() |
ตัวอย่างการใช้งาน Map
let map = new Map();
let obj = { name: "Alice" };
map.set(obj, "Data for Alice");
console.log(map.get(obj)); // "Data for Alice"
map.delete(obj); // ลบค่า
console.log(map.get(obj)); // undefined
map.clear(); // ล้างค่าทั้งหมด
console.log(map.size); // 0
ข้อสังเกต Map รองรับทั้ง .delete() และ .clear() ซึ่งช่วยจัดการข้อมูลได้ง่ายขึ้น
ตัวอย่างการใช้งาน WeakMap
let weakMap = new WeakMap();
let obj = { name: "Bob" };
weakMap.set(obj, "Data for Bob");
console.log(weakMap.get(obj)); // "Data for Bob"
weakMap.delete(obj); // ลบค่าออก
console.log(weakMap.get(obj)); // undefined
ข้อสังเกต WeakMap ไม่มี .clear() เนื่องจากการลบข้อมูลขึ้นอยู่กับ Garbage Collector
เปรียบเทียบ WeakMap กับ Set และ WeakSet
WeakMap คล้ายกับ WeakSet ในแง่ของการใช้ Weak References แต่มีข้อแตกต่างกันดังนี้:
| คุณสมบัติ | Set |
WeakSet |
Map |
WeakMap |
|---|---|---|---|---|
| คีย์/ค่า | เก็บค่าแบบ Unique | เก็บค่าแบบ Unique (Object เท่านั้น) | คีย์-ค่า | คีย์-ค่า (คีย์ต้องเป็น Object) |
ขนาด (size) |
มี .size |
ไม่มี .size |
มี .size |
ไม่มี .size |
วนลูป (forEach, keys) |
ได้ | ไม่ได้ | ได้ | ไม่ได้ |
| การจัดการหน่วยความจำ | ปกติ | GC ลบอัตโนมัติ | ปกติ | GC ลบอัตโนมัติ |
ลบค่า (delete) |
✅ มี .delete(value) |
✅ มี .delete(value) |
✅ มี .delete(key) |
✅ มี .delete(key) |
ล้างทั้งหมด (clear) |
✅ มี .clear() |
❌ ไม่มี .clear() |
✅ มี .clear() |
❌ ไม่มี .clear() |
✅ ตัวอย่าง WeakSet
let weakSet = new WeakSet();
let obj = { id: 1 };
weakSet.add(obj);
console.log(weakSet.has(obj)); // true
weakSet.delete(obj); // ลบค่าออก
console.log(weakSet.has(obj)); // false
สรุปการเลือกใช้งาน
| ต้องการใช้ | ใช้ Map |
ใช้ WeakMap |
|---|---|---|
| คีย์เป็น Primitive ได้ | ✅ | ❌ |
ใช้ .size, .keys(), .forEach() |
✅ | ❌ |
| ต้องการลบค่าทันทีเมื่อคีย์หายไป | ❌ | ✅ |
ใช้ .clear() เพื่อล้างทั้งหมด |
✅ | ❌ |
หรือ
| ต้องการใช้ | ใช้ Set |
ใช้ WeakSet |
|---|---|---|
| ต้องการเก็บค่าทุกประเภท | ✅ | ❌ (เฉพาะ Object) |
ใช้ .size หรือวนลูปข้อมูล |
✅ | ❌ |
| ต้องการให้ค่าหายไปเมื่อไม่มี reference | ❌ | ✅ |
ใช้ .clear() เพื่อล้างทั้งหมด |
✅ | ❌ |
คำแนะนำในการใช้งาน
WeakMapเหมาะกับ การเก็บข้อมูลชั่วคราว เช่น สถานะของ DOM Elements หรือ Cache ข้อมูลที่ต้องลบทิ้งอัตโนมัติMapและSetเหมาะกับ การเก็บข้อมูลที่ต้องการจัดการเองและต้องการคงอยู่ตลอดเวลาWeakSetเหมาะกับ การตรวจสอบว่า Object ยังถูกใช้อยู่หรือไม่ แต่ไม่เหมาะสำหรับข้อมูลที่ต้องวนลูปหรือใช้งานในเชิงโครงสร้างข้อมูลทั่วไป