JavaScript
Web Development
Coding
Array Manipulation
Object Oriented Programming

How to get distinct values from an array of objects in JavaScript?

Master System Design with Codemia

Enhance your system design skills with over 120 practice problems, detailed solutions, and hands-on exercises.

Introduction

Getting distinct values from an array of objects in JavaScript is really a question about what counts as "the same". Two objects can have the same business identity while still being different references in memory, so the usual solution is to derive a primitive key and deduplicate by that key explicitly.

Distinct Property Values with Set

If you only need the unique values of one property, use map plus Set.

javascript
1const employees = [
2  { name: "Ana", department: "Sales" },
3  { name: "Ben", department: "Engineering" },
4  { name: "Cara", department: "Sales" }
5];
6
7const departments = [...new Set(employees.map((e) => e.department))];
8console.log(departments);

This is the simplest case because Set works directly with primitive values such as strings and numbers.

Distinct Objects by One Key with Map

If you want distinct objects rather than distinct property values, use a key that defines uniqueness and store the objects in a Map.

javascript
1const users = [
2  { id: 1, name: "Ana" },
3  { id: 2, name: "Ben" },
4  { id: 1, name: "Ana Updated" }
5];
6
7const uniqueById = [...new Map(users.map((user) => [user.id, user])).values()];
8console.log(uniqueById);

Because later entries overwrite earlier ones in a Map, this version keeps the last object for each id. If you want the first one instead, guard the insert with map.has(key) before calling set.

Use a Set of Seen Keys for First-Wins Behavior

When keeping the first occurrence is important, a filter pass with a Set is often clearer.

javascript
1const seen = new Set();
2
3const firstWins = users.filter((user) => {
4  if (seen.has(user.id)) {
5    return false;
6  }
7  seen.add(user.id);
8  return true;
9});
10
11console.log(firstWins);

This makes the policy explicit. You can read the code and know immediately that later duplicates are discarded.

Distinct by Multiple Properties

Sometimes uniqueness depends on more than one field. In that case, build a composite key.

javascript
1const rows = [
2  { city: "Toronto", role: "Admin" },
3  { city: "Toronto", role: "Admin" },
4  { city: "Toronto", role: "User" }
5];
6
7const seenKeys = new Set();
8
9const distinct = rows.filter((row) => {
10  const key = `${row.city}::${row.role}`;
11  if (seenKeys.has(key)) {
12    return false;
13  }
14  seenKeys.add(key);
15  return true;
16});
17
18console.log(distinct);

This works well when the component fields are stable and easy to serialize. If the raw values can contain the delimiter, choose a safer encoding strategy.

Why Set Alone Does Not Deduplicate Objects

This is the point that trips people up most often:

javascript
1const a = { id: 1 };
2const b = { id: 1 };
3
4console.log([...new Set([a, b])]);

Both objects remain because JavaScript compares object references in a Set, not structural content. Even though a and b look equivalent, they are different objects in memory.

That is why object deduplication almost always starts by converting the business identity into a primitive key.

Avoid JSON.stringify as the Default

You may see examples like this:

javascript
const unique = [...new Set(rows.map((row) => JSON.stringify(row)))]
  .map((text) => JSON.parse(text));

This can work for small, controlled data, but it is a shortcut with limitations. Property order matters, unsupported values behave awkwardly, and the rule for equality becomes harder to reason about than an explicit key.

Use it only when the data is truly JSON-shaped and structural equality is exactly what you want.

Common Pitfalls

  • Using new Set(arrayOfObjects) and expecting structurally equal objects to collapse automatically.
  • Forgetting to choose whether the first duplicate or last duplicate should win.
  • Building composite keys without thinking about missing fields or delimiter collisions.
  • Using JSON.stringify as a universal deduplication trick even when the object shape is unstable.
  • Mixing up distinct property values with distinct whole objects.

Summary

  • Define uniqueness first, then choose the deduplication technique.
  • Use Set directly for primitive property values.
  • Use Map or a Set of derived keys for arrays of objects.
  • Build composite keys when uniqueness depends on more than one field.
  • Treat JSON.stringify as a limited shortcut, not the default design.

Course illustration
Course illustration

All Rights Reserved.