DEV Community πŸ‘©β€πŸ’»πŸ‘¨β€πŸ’»

DEV Community πŸ‘©β€πŸ’»πŸ‘¨β€πŸ’» is a community of 966,904 amazing developers

We're a place where coders share, stay up-to-date and grow their careers.

Create account Log in
Functional Javascript
Functional Javascript

Posted on

Code Snippet Series: Get Unique Values from Array

Here are three ways to retrieve the unique set of primitive values from an array....

//a. Set-Array.from
const getUniq_ArrayFrom = a => Array.from(new Set(a));

//b. Set-Spread
const getUniq_Set = a => [...new Set(a)];

//c. good ol' Loop
const getUniq_Loop = a => {
  const o = {};
  for (let i = 0; i < a.length; i++) {
    o[a[i]] = true;
  }
  return Object.keys(o);
};


//@perfTests

timeInLoop("getUniq_ArrayFrom", 1, () => getUniq_ArrayFrom(aNums));
// getUniq_ArrayFrom: 1e+0: 513.777ms

timeInLoop("getUniq_Set", 1, () => getUniq_Set(aNums));
// getUniq_Set: 1e+0: 521.112ms

timeInLoop("getUniq_Loop", 1, () => getUniq_Loop(aNums));
// getUniq_Loop: 1e+0: 44.433ms

I think we have a clear winner here. πŸ†
The loop wins by over 10X

Notes:

using an array of 10 million numbers between 1 and 100 (high duplication), the Loop idiom is 10X faster...

const aNums = genRandNums(1, 100, 1e7);

using an array of 10 million numbers between 1 and a million (low duplication), the Loop idiom is only 2X faster...

const aNums = genRandNums(1, 1e6, 1e7);

TimeInLoop Source Code:

https://gist.github.com/funfunction/91b5876a5f562e1e352aed0fcabc3858

Top comments (4)

Collapse
 
patarapolw profile image
Pacharapol Withayasakpunt • Edited on

jsperf.com/unique-arrays-1

Objects won't work with non-string keys, as well as nasty strings (e.g. __proto__).

Collapse
 
functional_js profile image
Functional Javascript Author

Correct, these funcs work with the primitives (string and number).

Ref types (comparing objects and arrays) require custom logic, even if working with Set and Map.

eg...

const aDups = [{ id: 1 }, { id: 1 }, { id: 1 }, { id: 1}];
const setDups = new Set(aDups)
console.log(setDups)

// output:
// Set(4) { { id: 1 }, { id: 1 }, { id: 1 }, { id: 1 } }

Collapse
 
nickfazzpdx profile image
Nicholas Fazzolari

Thank you for sharing the timeInLoop source code. Is the console.time() function where the measurement of time is actually done. I wonder how runtime is calculated in the Console code module.

Collapse
 
____marcell profile image
Marcell Cruz

Interesting, why is Set so slow, I would have guessed that it was going to be a lot faster

Visualizing Promises and Async/Await 🀯

async await

☝️ Check out this all-time classic DEV post