Array of JavaScript objects with duplicates being filtered through a Map to produce unique results
Last updated on

Creating a unique array of objects in javascript


Update (Feb 2, 2026): JavaScript still doesn’t have built-in deep-equality deduping for objects. Set/Map compare objects by identity, so two objects with the same content are still considered different. If you can define a stable key (like an id), the simplest modern approach is to dedupe by that key with a Map (or group with Object.groupBy/Map.groupBy in modern runtimes and take one item from each group). Otherwise, you still need a custom comparison or serialization approach.

Example (keeps the last item with a given key):

const unique = [...new Map(items.map(item => [item.id, item])).values()];

If you want to keep the first item instead, use a loop and only set when the key hasn’t been seen yet.

Background

I’m a javascript newbie. So, naturally, I spend a lot of time googling “javascript ”. I’m a couple of months into my journey and I feel like I’ve finally reached the point where python concepts have stopped muddying my javascript searches. Now, most of the time, I’m able to find answers after a single visit to Google.

Despite this progress, I ran into a problem that was too much for my beginner-level javascript Google-fu: Given an array of objects, how can I create a new array with no repeats?

Basically, I want to do something like: [ 1, 1, 2, 2, 1 ] -> [ 1, 2 ] but with objects instead of numbers.

The Problem

Let’s say you have an array (foo) that contains repeated values. You can use a Set to remove the duplicates.

What did I find?

I found that Set works great for primitive values like numbers or strings, but it doesn’t work as expected for objects.

Does Set work with objects?

Actually, Set does work with objects, but it compares them by reference (the memory address) rather than by value (the content of the object).

Comparing objects

Since two different objects with the same content are not “equal” in JavaScript, a Set will treat them as unique items.

Comparing strings

However, two strings with the same content are equal.

Modern approach: dedupe by a stable key

If your objects have a reliable key (like an id, slug, or email), you can dedupe with a Map in one line. This uses the key for equality and keeps the last item for each key:

const uniqueById = [...new Map(items.map(item => [item.id, item])).values()];

To keep the first item instead, use a loop:

const seen = new Set();
const uniqueFirst = [];
for (const item of items) {
  if (seen.has(item.id)) continue;
  seen.add(item.id);
  uniqueFirst.push(item);
}

If you want to group first and then choose which item to keep, Object.groupBy and Map.groupBy are available in modern runtimes (check compatibility), so you can take the first or last item from each group.

Fallback: serialize and Set

If you don’t have a stable key, one option is to convert each object to a string (using JSON.stringify), use a Set to remove duplicate strings, and then convert the unique strings back into objects (using JSON.parse).

Implementation Example (JSON.stringify fallback)

Here is a step-by-step code example demonstrating the serialization technique:

Caveats

  1. Key selection (Map/groupBy): Decide what makes two items “the same” and pick a stable key. A Map keeps the last value for a key by default, so be explicit about whether you want first or last.

  2. Key ordering (JSON.stringify fallback): The order of keys in an object matters for JSON.stringify. If two objects have the same keys and values but in a different order, they will result in different strings and thus won’t be caught as duplicates.

  1. Performance (JSON.stringify fallback): This approach requires serializing and deserializing every object, which might be inefficient for very large arrays.