WeakMap и HTMLElement в DOM

160
06 июля 2022, 16:10

Работа WeakMap понятна, но при попытке удалить узел из браузера в WeakMap этот же узел не удаляется.

Код примерно такой:

let weakList = new WeakMap(), /// Пусто
    element = $0; /// $0 для выделения любого элемента на странице
weakList.set(element, true);
console.log(weakList); /// Не пусто
element.remove();
element = null;
console.log(weakList); /// Не пусто

Как решить этот вопрос?

Answer 1

Вы удаляете элемент, но не выбрасываете его из значения переменной.

const map = new WeakMap();
let element = document.querySelector('span');
map.set(element,element.innerText);
console.log(map.get(element)); // элемент тут
element.remove();
console.log(map.get(element)); // всё ещё тут
element = null;
console.log(map.get(element)); // пропал!
<p>
  Text1
  <span>
    Text2
  </span>
  Text3
</p>

Answer 2

Не много не так поскольку в данном случае его там нет тоже.

const map = new WeakMap();
let element = document.querySelector('span');
map.set(element,element.innerText);
console.log(map.get(element)); // элемент тут
element = null;
console.log(map.has(element));
<p>
  Text1
  <span>
    Text2
  </span>
  Text3
</p>
WeakMap нужно немного постараться чтобы сделать валидный пример.

Answer 3

Никто никогда не обещал, что WeakMap очистится мгновенно. WeakMap всего лишь не будет мешать Garbage Collector-у убрать ненужные объекты.

Стандартом специально не предусмотрена возможность посмотреть что лежит внутри WeakMap, так что вывод console.log(weakList) это чистая самодеятельность браузера.

Более того, ваш вывод weakList в консоль добавил ссылку на объект (в консоли вы можете посмотреть его свойства и т.п.), так что GC его и не соберёт.

READ ALSO
React добавление обработчика только что созданным элементам
javascript

React добавление обработчика только что созданным элементам

Как правильно навесить обработчик на элемент, который создается в хуках?

 145
определенный скролл, анимация при скролле
javascript

определенный скролл, анимация при скролле

нужен примерно такой скроллинг как показанно здесь, http://luminouspilcom/#, я использовал инструмент snap-scroll, но не получил то что ожидал, на сайте, который...

 126
Нахождение нечетных и их количество
javascript

Нахождение нечетных и их количество

На промежутке от 0 до 1000 включительно, для каждого нечетного числа выводите в консоль слово FoundНайдите сумму таких чисел

 119
Получить значение переменных из javascript или html
javascript

Получить значение переменных из javascript или html

Я использую flask для создания будильника с web интерфейсомЯ создал вот такой html код:

 222