DEV Community

Cover image for JavaScript WeakMap and WeakSet
Bello Osagie
Bello Osagie

Posted on • Edited on

1

JavaScript WeakMap and WeakSet

WeakMap

In the previous article, the primitive value was used as the key. This is different in weakMap because the object is the key.

See the example below:

const weakMap = new WeakMap();

const obj = {};
const str = '';

weakMap.set(obj, "ok"); // WeakMap { <items unknown> }
weakMap.set(str, "ok");  // only use non-primitive data as key
// TypeError: Invalid value used as weak map key
Enter fullscreen mode Exit fullscreen mode

If there's no reference to the object, it gets removed from memory automatically.

See the example below:

let bello = { name: "Bello" };

const weakMap = new WeakMap();
weakMap.set(bello, 'noah');

bello = null; // changed/overriden reference

// bello is removed from memory!
Enter fullscreen mode Exit fullscreen mode

WeakMap does not support iteration methods like keys(), values(), entries().

The following methods still work on WeakMap.

  • weakMap.get(key)
  • weakMap.set(key, value)
  • weakMap.delete(key)
  • weakMap.has(key)

The reason behind non-supported iterable methods in WeakMap is that JavaScript engine memory cleanup (full or partial cleanup) may be done immediately or later when more deletions happen.


WeakSet

It is basically used as additional storage of the yes/no or true/false fact of an object like keeping track of people who visited a site:

Mostly only objects are added to WeakSet.

  • Supported methods are add has and delete.
  • It doesn't support size and keys().
  • Like weakMap iteration methods are not supported and also lack the ability to get all current content.

See the example below:

const visitedSet = new WeakSet();

let bello = { name: "Bello" };
const monica = { name: "Monica" };
const jennifer = { name: "Jennifer" };

visitedSet.add(bello); // Bello visited site
visitedSet.add(monica); // Monica visited site
visitedSet.add(bello); // Bello again visited site

// visitedSet has 2 users now

// check if Bello visited the site?
console.log( visitedSet.has(bello) ); // true

// check if Jennifer visited the site
console.log( visitedSet.has(jennifer) ); // false

bello = null; // visitedSet will be cleaned automatically
Enter fullscreen mode Exit fullscreen mode

Buy me a Coffee


Top comments (0)

The Most Contextual AI Development Assistant

Pieces.app image

Our centralized storage agent works on-device, unifying various developer tools to proactively capture and enrich useful materials, streamline collaboration, and solve complex problems through a contextual understanding of your unique workflow.

👥 Ideal for solo developers, teams, and cross-company projects

Learn more

👋 Kindness is contagious

Discover a treasure trove of wisdom within this insightful piece, highly respected in the nurturing DEV Community enviroment. Developers, whether novice or expert, are encouraged to participate and add to our shared knowledge basin.

A simple "thank you" can illuminate someone's day. Express your appreciation in the comments section!

On DEV, sharing ideas smoothens our journey and strengthens our community ties. Learn something useful? Offering a quick thanks to the author is deeply appreciated.

Okay