How to get the unique properties of a set of objects in a JavaScript array

Given an array of objects, here's what you can do if you want to get the values of a property, but not duplicated.

Suppose you have a bills array with this content:

const bills = [
  { date: '2018-01-20', amount: '220', category: 'Electricity' },
  { date: '2018-01-20', amount: '20', category: 'Gas' },
  { date: '2018-02-20', amount: '120', category: 'Electricity' }
]

and you want to extract the unique values of the category attribute of each item in the array.

Here’s what you can do:

const categories = [...new Set(bills.map(bill => bill.category))]

Explanation

Set is a new data structure that JavaScript got in ES6. It’s a collection of unique values. We put into that the list of property values we get from using map(), which how we used it will return this array:

['Electricity', 'Gas', 'Electricity']

Passing through Set, we’ll remove the duplicates.

... is the spread operator, which will expand the set values into an array.

Download my free JavaScript Beginner's Handbook and check out my JavaScript Masterclass!

⭐️ Join the waiting list for the JavaScript Masterclass ⭐️