DEV Community

Cover image for JavaScript Sets are Excellent!

JavaScript Sets are Excellent!

Jacob Evans on July 17, 2019

Sets In JavaScript Are 🔥 In MDN Set it states "The Set object lets you store unique values of any type, whether primitive values or obj...
Collapse
 
averyferrante profile image
Joseph Avery Ferrante • Edited

Cool read!

Fun 'interview style' question that can utilize sets:
Return an array of unique characters from the string 'Hello World', excluding spaces:

*** MY ANSWER ***

new Set('hello world'.split(' ').reduce((acc, cur) => acc.concat([...cur]), []));

  • OR using new flatMap operator -

new Set('hello world'.split(' ').flatMap(cur => [...cur]));

Collapse
 
bushblade profile image
Will Adams

Cool I guess you could also do
[...new Set([...'Hello World'])]

Collapse
 
jamesthomson profile image
James Thomson

Almost, it won't exclude the space so you'd have to do something like [...new Set([...'Hello World'.replace(/\s/g, '')])] which kinda ruins how nice and concise this was :(

Thread Thread
 
jacobmgevans profile image
Jacob Evans

All awesome implementations!!

Collapse
 
bushblade profile image
Will Adams

Fair point I forgot about the space.

Collapse
 
jacobmgevans profile image
Jacob Evans

Thanks! :)

Collapse
 
seanmclem profile image
Seanmclem • Edited

I've been pretty impressed by the potential of sets before. I feel a little confused

Collapse
 
jacobmgevans profile image
Jacob Evans

What's confusing maybe I can help?

Collapse
 
seanmclem profile image
Seanmclem

I'd seen them used before to make iterable objects of some kind. I didn't fully understand it. But here you're using it to remove duplicates from an array. Is this the intended behavior of sets?

Thread Thread
 
jacobmgevans profile image
Jacob Evans

It is not the only intended use for Sets, they are also wicked fast and efficient at locating elements to see if they exist and deleting elements. Both are built-in functionality for Sets. I like to think of sets as almost a Hybrid of Maps and Arrays, its a bit of an oversimplification and generalization but I personally like thinking about them in that way.

One major difference is Arrays are Indexed collections while Sets are Keyed collections, which allows for some of the behaviors I mentioned that are similar to Maps like .has and .delete() and also related to why duplicates are not allowed (Maps also can't have duplicates)

Thread Thread
 
seanmclem profile image
Seanmclem

I didn't know that map was its own type of object - in addition to a function on an array
developer.mozilla.org/en-US/docs/W...

Collapse
 
khangprcvn profile image
khangprcvn

Thanks for sharing

Collapse
 
jacobmgevans profile image
Jacob Evans

Happy too! I plan on adding more to the article so stay tuned lol

Collapse
 
jethrolarson profile image
Jethro Larson

Also cool are the new methods in draft to be added to the language: github.com/tc39/proposal-set-methods

Collapse
 
jacobmgevans profile image
Jacob Evans

Thank you! 😁