JavaScript WeakMap — словник, що не тримає ключі в пам'яті


WeakMap — словник із слабкими посиланнями на ключі: якщо на об'єкт-ключ більше ніхто не посилається, збирач сміття прибере і його, і запис у словнику.

автор: NagarD

Загальний опис

Звичайний Map тримає свої ключі. Поклав туди DOM-елемент — і навіть після видалення елемента зі сторінки він лишиться живим у пам'яті, бо словник на нього посилається. Це класичний витік пам'яті.

WeakMap цього не робить: він не заважає збирачу сміття. Елемент зник зі сторінки — запис зник сам, без жодного delete().

Звідси два застосування: прив'язка даних до DOM-вузлів і приватні дані класу — властивість, до якої немає доступу ззовні, бо ключ (this) знає лише сам клас.

Платою за це є обмеження: ключі тільки об'єкти, перебрати WeakMap не можна, size немає. Це не колекція, а саме прив'язка — і саме тому вона безпечна.

автор: NagarD

Нотатка

Перебрати WeakMap неможливо за задумом: вміст може зникнути будь-якої миті, тож стабільного списку ключів просто не існує.

автор: NagarD

Синтаксис

const wm = new WeakMap();

методи

Метод Опис
set Додає пару об'єкт–значення.
get Повертає значення за ключем-об'єктом.
has Перевіряє наявність ключа.
delete Видаляє пару за ключем.

Переглядачі

Підтримка: стаціонарні переглядачі
Переглядач Google Chrome Mozilla Firefox Apple Safari Opera Microsoft EDGE Microsoft Internet Explorer
WeakMap 36+ 6+ 8+ 23+ 12+ 11+
Підтримка: мобільні переглядачі
Переглядач Mobile Google Android Mobile Google Chrome Mobile Mozilla Firefox Mobile Apple Safari
WeakMap 36+ yes yes 8+

Приклади

+ запропонувати свій приклад у пісочниці

Дані, прив'язані до елемента, зникають разом із ним.

HTML

<button>Клацни мене</button>

JS

const data = new WeakMap();

const button = document.querySelector('button');
data.set(button, { clicks: 0 });

button.addEventListener('click', () => {
    const state = data.get(button);
    state.clicks++;
    console.log('Кліків:', state.clicks);
});

// приватні дані класу: ключ (this) знає лише сам клас
const secrets = new WeakMap();

class User {
    constructor(password) {
        secrets.set(this, { password });
    }

    check(input) {
        return secrets.get(this).password === input;
    }
}

const user = new User('таємниця');
console.log(user.check('таємниця')); // true
// видалиш елемент чи об'єкт — запис у WeakMap зникне сам, без витоку
автор: NagarD

Коментарі

Коментарів ще немає — будьте першим!

Відповідь для

Увійдіть — коментар з'явиться одразу, без капчі й очікування перевірки.

Пропозиція правки

Ваша версія — : після перевірки замінить чинну. Нова порада чи нотатка — з'явиться на сторінці після перевірки.

Ви гість — діють добові ліміти. Увійдіть, щоб пропонувати без капчі.

Ваша версія секції «»: після перевірки замінить чинну.

Ви гість — діють добові ліміти. Увійдіть, щоб пропонувати без капчі.

Ваша версія опису «»: після перевірки замінить чинну.

Ви гість — діють добові ліміти. Увійдіть, щоб пропонувати без капчі.

Зворотний зв'язок
Вхід