首頁 >web前端 >js教程 >JS 中的 WeakMap 是什麼?

JS 中的 WeakMap 是什麼?

Susan Sarandon
Susan Sarandon原創
2024-12-27 08:45:10241瀏覽

JavaScript 中的

What are WeakMaps in JS?

WeakMap 是一個鍵值對的集合,其中鍵必須是objects,以及這些物件的引用鍵很「弱」。這意味著如果沒有其他對關鍵物件的引用,即使它仍在 WeakMap 中,它也可以被垃圾回收。


主要特點

  1. 鍵必須是物件:

    • 原始值(如數字、字串或布林值)不能用作鍵。
    • 僅允許物件和函數作為鍵。
  2. 弱引用

    • WeakMap 中的關鍵物件是弱保存的。
    • 如果某個鍵不存在其他引用,則該鍵值對將自動從 WeakMap 中刪除。
  3. 不可迭代:

    • WeakMap 沒有像 forEach 這樣的方法,也不能使用像 for...of 或 Object.keys() 這樣的結構來循環。
    • 這是因為垃圾收集過程使得無法可靠地列出所有條目。
  4. 對私人資料有用

    • WeakMap 通常用於將私有資料與物件關聯而不暴露它。

文法

const weakMap = new WeakMap();

方法

Method Description
weakMap.set(key, value) Adds a new key-value pair or updates an existing key.
weakMap.get(key) Retrieves the value associated with the key.
weakMap.has(key) Checks if the key exists in the WeakMap.
weakMap.delete(key) Removes the key-value pair associated with the key.

範例

基本用法

const weakMap = new WeakMap();

垃圾收集

const weakMap = new WeakMap();

const obj1 = { name: "Alice" };
const obj2 = { name: "Bob" };

// Adding key-value pairs
weakMap.set(obj1, "Data for Alice");
weakMap.set(obj2, "Data for Bob");

// Accessing values
console.log(weakMap.get(obj1)); // Output: "Data for Alice"

// Checking existence
console.log(weakMap.has(obj2)); // Output: true

// Removing a key-value pair
weakMap.delete(obj2);
console.log(weakMap.has(obj2)); // Output: false

用例

  1. 私有資料儲存
    • 將私人資料與物件關聯,確保它不會在其他地方暴露或存取。
let obj = { key: "value" };
const weakMap = new WeakMap();
weakMap.set(obj, "Some data");

// Remove all references to `obj`
obj = null;

// The `WeakMap` entry for `obj` is automatically removed by garbage collection.
  1. DOM 節點元資料
    • 儲存與 DOM 元素相關的元數據,而不阻止垃圾回收。
const privateData = new WeakMap();

class User {
    constructor(name) {
        privateData.set(this, { name });
    }

    getName() {
        return privateData.get(this).name;
    }
}

const user = new User("Alice");
console.log(user.getName()); // Output: "Alice"

優點

  • 記憶體效率:自動刪除未引用的鍵有助於有效管理記憶體。
  • 封裝:提供一種私密且安全地儲存資料的方式。
  • 無記憶體洩漏:透過允許對鍵進行垃圾回收來防止意外記憶體洩漏。

限制

  1. 不可迭代
    • 無法列出所有鍵或值。
  2. 僅限物件鍵
    • 不支援原始鍵。
  3. 有限用例
    • 不適合需要枚舉或完全存取儲存資料的場景。

綜上所述,WeakMap 是專門為需要弱引用和私有關聯的場景而設計的集合。

Map 與 WeakMap 的差別

JavaScript 中 MapWeakMap 之間的主要區別在於它們對鍵、垃圾收集和功能的處理。詳細比較如下:


主要差異

功能
Feature Map WeakMap
Key Types Keys can be any type: objects, primitives. Keys must be objects.
Garbage Collection Does not rely on garbage collection; keys persist. Keys are held weakly and can be garbage-collected.
Iteration Iterable (can use for...of, forEach, etc.). Not iterable (cannot list keys or values).
Size Property Has a size property to get the number of entries. No size property available.
Use Case General-purpose key-value storage. Specialized for associating metadata or private data with objects.
Performance Slightly slower due to strong key references. Faster for memory-sensitive operations due to weak references.
地圖 WeakMap 標題> 鍵類型 鍵可以是任何類型:物件、基元。 鍵必須是物件。 垃圾收集 不依賴垃圾收集;密鑰仍然存在。 密鑰的保存較弱,可以被垃圾收集。 迭代 可迭代(可使用 for...of、forEach 等)。 不可迭代(無法列出鍵或值)。 大小屬性 具有大小屬性來取得條目數。 沒有可用的尺寸屬性。 用例 通用鍵值儲存。 專門用於將元資料或私人資料與物件關聯。 性能 由於強鍵引用,速度稍慢。 由於弱引用,記憶體敏感操作速度更快。 表>

功能比較

1.關鍵類型

  • Map:接受物件和原始類型(如字串、數字、布林值)作為鍵。
  • WeakMap:僅接受物件作為鍵。不允許使用原語。
const weakMap = new WeakMap();

2.垃圾收集

  • Map:保留對鍵的強引用,只要它存在於地圖中,就可以防止它被垃圾收集。
  • WeakMap:儲存對鍵的弱引用,如果沒有其他引用,則允許對其進行垃圾收集。
const weakMap = new WeakMap();

const obj1 = { name: "Alice" };
const obj2 = { name: "Bob" };

// Adding key-value pairs
weakMap.set(obj1, "Data for Alice");
weakMap.set(obj2, "Data for Bob");

// Accessing values
console.log(weakMap.get(obj1)); // Output: "Data for Alice"

// Checking existence
console.log(weakMap.has(obj2)); // Output: true

// Removing a key-value pair
weakMap.delete(obj2);
console.log(weakMap.has(obj2)); // Output: false

3.迭代

  • Map:可迭代。您可以使用 for...of、.keys()、.values()、.entries() 或 .forEach() 來迭代其內容。
  • WeakMap:不可迭代。沒有方法可以檢索所有鍵、值或條目。
let obj = { key: "value" };
const weakMap = new WeakMap();
weakMap.set(obj, "Some data");

// Remove all references to `obj`
obj = null;

// The `WeakMap` entry for `obj` is automatically removed by garbage collection.

4.大小屬性

  • Map:提供傳回條目數量的大小屬性。
  • WeakMap:沒有 size 屬性,因為它不可迭代且條目是弱引用的。
const privateData = new WeakMap();

class User {
    constructor(name) {
        privateData.set(this, { name });
    }

    getName() {
        return privateData.get(this).name;
    }
}

const user = new User("Alice");
console.log(user.getName()); // Output: "Alice"

用例

何時使用地圖

  • 通用鍵值儲存。
  • 需要枚舉或迭代鍵和值的場景。
  • 鍵可以是原語或物件。

範例:

const metadata = new WeakMap();

function trackElement(element) {
    metadata.set(element, { clicks: 0 });
}

function incrementClicks(element) {
    const data = metadata.get(element);
    if (data) {
        data.clicks++;
    }
}

const button = document.createElement("button");
trackElement(button);
incrementClicks(button);
console.log(metadata.get(button)); // Output: { clicks: 1 }

何時使用 Wea​​lMap

  • 當您需要將元資料或私人資料與物件關聯而不阻止垃圾收集。
  • 非常適合鍵的生命週期應決定關聯值的生命週期的情況。

範例:

const map = new Map();
map.set(1, "value"); // Allowed
map.set("key", "value"); // Allowed
map.set({}, "value"); // Allowed

const weakMap = new WeakMap();
weakMap.set({}, "value"); // Allowed
weakMap.set(1, "value"); // TypeError: Invalid value used as weak map key

總結

功能
Feature Map WeakMap
Flexibility General-purpose, flexible. Specialized, limited use case.
Performance Persistent key references. Memory-efficient with weak references.
Suitability Iteration and long-term storage. Private data and ephemeral relationships.
地圖 WeakMap 標題> 靈活性 通用、靈活。 專門的、有限的用例。 性能 持久關鍵引用。 弱引用提高記憶體效率。 適用性 迭代和長期儲存。 私人資料和短暫關係。 表>

以上是JS 中的 WeakMap 是什麼?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn