JS Set - Part 1

As with everything new I experience nowadays I came across the powerful JS Set object while searching for a way to remove duplicate objects from an array of objects.

I have been reworking and upgrading a project of mine, ReadThat, recently and while integrating a voting function I have into a commenting function I have I came across an issue with a sorting function I have. It adds a duplicate instance of one of the things being sorted! Instead of reworking the thing my sort function sorts (a hasty decision on my part to use an overly sparse hash to store vote counts); or to rework what information is passed from server to client (rework backend to store vote counts (too expensive maybe)) I chose to remove the duplicates and call it good. Now as everyone knows planning is key, but what not everyone seems to know and or acknowledge is that when things don't go to plan there's a 99.9999% chance that there's a work around. So I chose my work around aka the Set method; MDN documentation for those so inclined.

What is Set

Set is a powerful tool that allows the user to create a collection of unique values of primitive values or Objects.

The Set object lets you store unique values of any type, whether primitive values or object references.

and from the description;

Set objects are collections of values. You can iterate through the elements of a set in insertion order. A value in the Set may only occur once; it is unique in the Set's collection.

-MDN documentation

It's basically a super open ended collection of unique values that allows the bridging of Array and Object methods through the creative and insightful use of their respective methods.

Quickly, how to make a set...(is this not what you came here for!?)

"But Anders!? Where's the Beef?"

I won't go too in depth into the Set methods but briefly here's how to make a set.

let thing = [[1 ,"two", #], {4: $}, {5: %}]

let thingSet = new Set(thing)

or just

let thingSet = new Set([[1 ,"two", #], {4: $}, {5: %}])

Make a set into an array - Peasy!

Working with Set objects is relatively easy. Even though Set Objects are iterable the most efficient way I've found to work with Set Objects is converting them into a more common data structure with Array.from() or Object.fromEntries()

//thingSet from before BTW!
let thingSetArr = Array.from(thingSet)

Sorting an Array of Objects with Set...(Are you not entertained!?)

So Now for what you came hee -- "Found the Beef". Erm, uh, OK.
Now for what you came here for, sorting an Array of Objects.
Remembering back to my predicament at the beginning of this post, after much deliberation and a oft found stackoverflow post later I had a solution to my problem. With the Set Object and its associated method and the Array.from() method my path was clear. In order to achieve mediocrity and wrought the wrath of bugs I must Array.map() out an array of ids from my Object-Array, create a unique Set of those ids, convert that Set back into an Array with Array.from() while maintaining the ability to iterate through it in one variable assignment and finally mapping through the Array of ids while returning found objects from the original Object-Array. Voila! A unique array of Objects!

    const output = Array.from(new Set(placeholder.map(a => a.id))).map(id => {
        return placeholder.find(a => a.id === id);
    })

Thanks for checking out this week's edition. Have a Job for me? contact me on linkedIn! :D