How to Get Distinct Values in a JavaScript Array

Suppose you have an array with duplicate values:

const arr = ['a', 'b', 'c', 'c', 'b'];

To get an array that contains just the distinct values in arr, you can first convert arr to a Set and then convert that Set to an array.

const deduped = [...new Set(arr)]; // ['a', 'b', 'c']

Note that JavaScript Sets check for equality based on SameValueZero equality. So using the new Set() approach will only work for arrays of primitive values, not arrays of objects.

Deduping Arrays of Arrays

Suppose you have an array of objects which contain some arrays.

const blogPosts = [
  {
    title: 'Distinct Array Values in JavaScript',
    tags: ['fundamentals', 'arrays']
  },
  {
    title: 'Arrays in Mongoose',
    tags: ['arrays', 'mongoose']
  }
];

How do you get all distinct values of tags? Turns out you can use the above Set approach, combined with JavaScript's built-in array flatMap() function. flatMap() behaves like map(), but it also "flattens" out any arrays that your function returns.

const tags = [...new Set(blogPosts.flatMap(blogPost => blogPost.tags))];
tags; // ['fundamentals', 'arrays', 'mongoose']
// ['fundamentals', 'arrays', 'arrays', 'mongoose']
blogPosts.flatMap(blogPost => blogPost.tags);

More Fundamentals Tutorials

• The `setTimeout()` Function in JavaScript
• JavaScript Array flatMap()
• Check if a Date is Valid in JavaScript
• Encode base64 in JavaScript
• Check if URL Contains a String
• JavaScript Add Month to Date
• JavaScript Add Days to Date