Javascript equivalent of array_unique in PHP

Question

I've been looking for a native javascript function which represents the equivalent of PHP's

$Fruit_Bowl = array_unique($Fruit_Bowl);

I can recreate this myself, using a pair of nested loops:

the outer loop counts down through the array
the inner loop checks if the current element is a duplicate of something we've already had

Working Example:

let fruitBowl = [
  'apple',
  'apple',
  'apple',
  'apple',
  'apple',
  'banana',
  'banana',
  'cherry',
  'cherry',
  'cherry',
  'damson',
  'elderberry',
  'fig',
  'fig'
];

for (i = (fruitBowl.length - 1); (i + 1) > 0; i--) {
  for (j = (i + 1); j < fruitBowl.length; j++) {
    if (fruitBowl[j] === fruitBowl[i]) {
      fruitBowl.splice(i, 1);
    }
  }
}

console.log(fruitBowl);

But, surely there is something faster, more concise and more elegant than this?

(Perhaps in newer versions of javascript, if not in older ones?)

I typed in "duplicates" in my URL bar and got the page from my browser history. It's quite common question, so I remember part of the title and it's enough to find it in browser history. You can also find it by using "unique array javascript" in your search engine. [First result in Google for me](https://i.imgur.com/zD7Gfrd.png) — VLAZ, May 28 '21 at 13:10
Thanks. Good to know. I think I typed in variations of: _"javascript equivalent of array_unique in PHP"_ and had no luck despite repeated searches. — Rounin, May 28 '21 at 13:14

score 0 · Answer 1 · answered May 28 '21 at 13:06

0

[...] surely there is something faster, more concise and more elegant than this?

Yes, it turns out there is.

I'm less familiar with collections in Javascript like Map and Set but it turns out that Set very explicitly represents a special kind of Array which may only contain an element once.

Consequently, turning an array into a set and then back into an array:

fruitBowl = [... new Set(fruitBowl)];

is exactly what I needed.

Working Example:

let fruitBowl = [
  'apple',
  'apple',
  'apple',
  'apple',
  'apple',
  'banana',
  'banana',
  'cherry',
  'cherry',
  'cherry',
  'damson',
  'elderberry',
  'fig',
  'fig'
];

fruitBowl = [... new Set(fruitBowl)];

console.log(fruitBowl);

answered May 28 '21 at 13:06

Rounin

27,134
9
83
108

1

"*it turns out that Set very explicitly represents a special kind of Array which may only contain an element once*" [that's not a JS thing](https://en.wikipedia.org/wiki/Set_(abstract_data_type)) – VLAZ May 28 '21 at 13:08
@VLAZ Thanks for the heads up. It's good to learn that `Sets` are not exclusively a JS thing but I should mention that I've never encountered `Sets` in PHP, HTML, CSS, SVG, JSON etc. – Rounin May 28 '21 at 13:11
2

HTML is a markup language, doesn't have data structures. Neither does CSS, or SVG. JSON is a serialisation format. [There is something called Set in PHP](https://www.php.net/manual/en/class.ds-set.php) and there are other data structures mentioned but I've no idea where these come from. Haven't worked with PHP for almost a decade, so I don't know what `Ds\Set` is supposed to be. – VLAZ May 28 '21 at 13:14
Right. My point was only that not all of us who use javascript are from a programming background. Some of us are from a web / media background. Thus, we don't know about established data structures (in Javascript, PHP or anything else), until we learn about them. – Rounin May 28 '21 at 13:16

Javascript equivalent of array_unique in PHP

1 Answers1