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

JavascriptArraysUnique

Javascript Problem Overview


Assuming I have the following:

var array = 
    [        {"name":"Joe", "age":17},         {"name":"Bob", "age":17},         {"name":"Carl", "age": 35}    ]

What is the best way to be able to get an array of all of the distinct ages such that I get an result array of:

[17, 35]

Is there some way I could alternatively structure the data or better method such that I would not have to iterate through each array checking the value of "age" and check against another array for its existence, and add it if not?

If there was some way I could just pull out the distinct ages without iterating...

Current inefficent way I would like to improve... If it means that instead of "array" being an array of objects, but a "map" of objects with some unique key (i.e. "1,2,3") that would be okay too. Im just looking for the most performance efficient way.

The following is how I currently do it, but for me, iteration appears to just be crummy for efficiency even though it does work...

var distinct = []
for (var i = 0; i < array.length; i++)
   if (array[i].age not in distinct)
      distinct.push(array[i].age)

Javascript Solutions


Solution 1 - Javascript

If you are using ES6/ES2015 or later you can do it this way:

const data = [
  { group: 'A', name: 'SD' }, 
  { group: 'B', name: 'FI' }, 
  { group: 'A', name: 'MM' },
  { group: 'B', name: 'CO'}
];
const unique = [...new Set(data.map(item => item.group))]; // [ 'A', 'B']

Here is an example on how to do it.

Solution 2 - Javascript

using ES6

let array = [
  { "name": "Joe", "age": 17 },
  { "name": "Bob", "age": 17 },
  { "name": "Carl", "age": 35 }
];
array.map(item => item.age)
  .filter((value, index, self) => self.indexOf(value) === index)

> [17, 35]

Solution 3 - Javascript

For those who want to return object with all properties unique by key

const array =
  [
    { "name": "Joe", "age": 17 },
    { "name": "Bob", "age": 17 },
    { "name": "Carl", "age": 35 }
  ]

const key = 'age';

const arrayUniqueByKey = [...new Map(array.map(item =>
  [item[key], item])).values()];

console.log(arrayUniqueByKey);

   /*OUTPUT
       [
        { "name": "Bob", "age": 17 },
        { "name": "Carl", "age": 35 }
       ]
   */

// Note: this will pick the last duplicated item in the list.

Solution 4 - Javascript

If this were PHP I'd build an array with the keys and take array_keys at the end, but JS has no such luxury. Instead, try this:

var flags = [], output = [], l = array.length, i;
for( i=0; i<l; i++) {
    if( flags[array[i].age]) continue;
    flags[array[i].age] = true;
    output.push(array[i].age);
}

Solution 5 - Javascript

Using ES6 features, you could do something like:

const uniqueAges = [...new Set( array.map(obj => obj.age)) ];

Solution 6 - Javascript

You could use a dictionary approach like this one. Basically you assign the value you want to be distinct as a key in the "dictionary" (here we use an array as an object to avoid dictionary-mode). If the key did not exist then you add that value as distinct.

Here is a working demo:

var array = [{"name":"Joe", "age":17}, {"name":"Bob", "age":17}, {"name":"Carl", "age": 35}];
var unique = [];
var distinct = [];
for( let i = 0; i < array.length; i++ ){
  if( !unique[array[i].age]){
    distinct.push(array[i].age);
    unique[array[i].age] = 1;
  }
}
var d = document.getElementById("d");
d.innerHTML = "" + distinct;

<div id="d"></div>

This will be O(n) where n is the number of objects in array and m is the number of unique values. There is no faster way than O(n) because you must inspect each value at least once.

The previous version of this used an object, and for in. These were minor in nature, and have since been minorly updated above. However, the reason for a seeming advance in performance between the two versions in the original jsperf was due to the data sample size being so small. Thus, the main comparison in the previous version was looking at the difference between the internal map and filter use versus the dictionary mode lookups.

I have updated the code above, as noted, however, I have also updated the jsperf to look through 1000 objects instead of 3. 3 overlooked many of the performance pitfalls involved (obsolete jsperf).

Performance

https://jsperf.com/filter-vs-dictionary-more-data When I ran this dictionary was 96% faster.

filter vs dictionary

Solution 7 - Javascript

This is how you would solve this using new Set via ES6 for Typescript as of August 25th, 2017

Array.from(new Set(yourArray.map((item: any) => item.id)))

Solution 8 - Javascript

I'd just map and remove dups:

var ages = array.map(function(obj) { return obj.age; });
ages = ages.filter(function(v,i) { return ages.indexOf(v) == i; });

console.log(ages); //=> [17, 35]

Edit: Aight! Not the most efficient way in terms of performance, but the simplest most readable IMO. If you really care about micro-optimization or you have huge amounts of data then a regular for loop is going to be more "efficient".

Solution 9 - Javascript

var unique = array
    .map(p => p.age)
    .filter((age, index, arr) => arr.indexOf(age) == index)
    .sort(); // sorting is optional

// or in ES6

var unique = [...new Set(array.map(p => p.age))];

// or with lodash

var unique = _.uniq(_.map(array, 'age'));

ES6 example

const data = [
  { name: "Joe", age: 17}, 
  { name: "Bob", age: 17}, 
  { name: "Carl", age: 35}
];

const arr = data.map(p => p.age); // [17, 17, 35]
const s = new Set(arr); // {17, 35} a set removes duplications, but it's still a set
const unique = [...s]; // [17, 35] Use the spread operator to transform a set into an Array
// or use Array.from to transform a set into an array
const unique2 = Array.from(s); // [17, 35]

Solution 10 - Javascript

There are many valid answers already, but I wanted to add one that uses only the reduce() method because it is clean and simple.

function uniqueBy(arr, prop){
  return arr.reduce((a, d) => {
    if (!a.includes(d[prop])) { a.push(d[prop]); }
    return a;
  }, []);
}

Use it like this:

var array = [
  {"name": "Joe", "age": 17}, 
  {"name": "Bob", "age": 17}, 
  {"name": "Carl", "age": 35}
];

var ages = uniqueBy(array, "age");
console.log(ages); // [17, 35]

Solution 11 - Javascript

const array = [
  {"id":"93","name":"CVAM_NGP_KW"},
  {"id":"94","name":"CVAM_NGP_PB"},
  {"id":"93","name":"CVAM_NGP_KW"},
  {"id":"94","name":"CVAM_NGP_PB"}
]

function uniq(array, field) {
  return array.reduce((accumulator, current) => {
      if(!accumulator.includes(current[field])) {
        accumulator.push(current[field])
      }
      return accumulator;
    }, []
  )
}

const ids = uniq(array, 'id');
console.log(ids)

/* output 
["93", "94"]
*/

Solution 12 - Javascript

I have a small solution

let data = [{id: 1}, {id: 2}, {id: 3}, {id: 2}, {id: 3}];

let result = data.filter((value, index, self) => self.findIndex((m) => m.id === value.id) === index);

Solution 13 - Javascript

The forEach version of @travis-j's answer (helpful on modern browsers and Node JS world):

var unique = {};
var distinct = [];
array.forEach(function (x) {
  if (!unique[x.age]) {
    distinct.push(x.age);
    unique[x.age] = true;
  }
});

34% faster on Chrome v29.0.1547: http://jsperf.com/filter-versus-dictionary/3

And a generic solution that takes a mapper function (tad slower than direct map, but that's expected):

function uniqueBy(arr, fn) {
  var unique = {};
  var distinct = [];
  arr.forEach(function (x) {
    var key = fn(x);
    if (!unique[key]) {
      distinct.push(key);
      unique[key] = true;
    }
  });
  return distinct;
}

// usage
uniqueBy(array, function(x){return x.age;}); // outputs [17, 35]

Solution 14 - Javascript

This is a slight variation on the ES6 version if you need the entire object:

let arr = [    {"name":"Joe", "age":17},     {"name":"Bob", "age":17},     {"name":"Carl", "age": 35}]
arr.filter((a, i) => arr.findIndex((s) => a.age === s.age) === i) // [{"name":"Joe", "age":17}, {"name":"Carl", "age": 35}]

Solution 15 - Javascript

I've started sticking Underscore in all new projects by default just so I never have to think about these little data-munging problems.

var array = [{"name":"Joe", "age":17}, {"name":"Bob", "age":17}, {"name":"Carl", "age": 35}];
console.log(_.chain(array).map(function(item) { return item.age }).uniq().value());

Produces [17, 35].

Solution 16 - Javascript

Here's another way to solve this:

var result = {};
for(var i in array) {
    result[array[i].age] = null;
}
result = Object.keys(result);

I have no idea how fast this solution is compared to the others, but I like the cleaner look. ;-)


EDIT: Okay, the above seems to be the slowest solution of all here.

I've created a performance test case here: http://jsperf.com/distinct-values-from-array

Instead of testing for the ages (Integers), I chose to compare the names (Strings).

Method 1 (TS's solution) is very fast. Interestingly enough, Method 7 outperforms all other solutions, here I just got rid of .indexOf() and used a "manual" implementation of it, avoiding looped function calling:

var result = [];
loop1: for (var i = 0; i < array.length; i++) {
    var name = array[i].name;
    for (var i2 = 0; i2 < result.length; i2++) {
        if (result[i2] == name) {
            continue loop1;
        }
    }
    result.push(name);
}

The difference in performance using Safari & Firefox is amazing, and it seems like Chrome does the best job on optimization.

I'm not exactly sure why the above snippets is so fast compared to the others, maybe someone wiser than me has an answer. ;-)

Solution 17 - Javascript

using lodash

var array = [    { "name": "Joe", "age": 17 },    { "name": "Bob", "age": 17 },    { "name": "Carl", "age": 35 }];
_.chain(array).pluck('age').unique().value();
> [17, 35]

Solution 18 - Javascript

var array = [
          {"name":"Joe", "age":17}, 
          {"name":"Bob", "age":17}, 
          {"name":"Carl", "age": 35}
      ];

      const ages = [...new Set(array.reduce((a, c) => [...a, c.age], []))];
    
      console.log(ages);

Solution 19 - Javascript

Simple distinct filter using Maps :

let array = 
    [
        {"name":"Joe", "age":17}, 
        {"name":"Bob", "age":17}, 
        {"name":"Carl", "age": 35}
    ];

let data = new Map();

for (let obj of array) {
  data.set(obj.age, obj);
}

let out = [...data.values()];

console.log(out);

Solution 20 - Javascript

const array =
  [
    { "name": "Joe", "age": 17 },
    { "name": "Bob", "age": 17 },
    { "name": "Carl", "age": 35 }
  ]

const key = 'age';

const arrayUniqueByKey = [...new Map(array.map(item =>
  [item[key], item])).values()];

console.log(arrayUniqueByKey);

Solution 21 - Javascript

Using Lodash

var array = [    { "name": "Joe", "age": 17 },    { "name": "Bob", "age": 17 },    { "name": "Carl", "age": 35 }];

_.chain(array).map('age').unique().value();

Returns [17,35]

Solution 22 - Javascript

function get_unique_values_from_array_object(array,property){
    var unique = {};
    var distinct = [];
    for( var i in array ){
       if( typeof(unique[array[i][property]]) == "undefined"){
          distinct.push(array[i]);
       }
       unique[array[i][property]] = 0;
    }
    return distinct;
}

Solution 23 - Javascript

underscore.js _.uniq(_.pluck(array,"age"))

Solution 24 - Javascript

Here's a versatile solution that uses reduce, allows for mapping, and maintains insertion order.

items: An array

mapper: A unary function that maps the item to the criteria, or empty to map the item itself.

function distinct(items, mapper) {
    if (!mapper) mapper = (item)=>item;
    return items.map(mapper).reduce((acc, item) => {
        if (acc.indexOf(item) === -1) acc.push(item);
        return acc;
    }, []);
}

Usage

const distinctLastNames = distinct(items, (item)=>item.lastName);
const distinctItems = distinct(items);

You can add this to your Array prototype and leave out the items parameter if that's your style...

const distinctLastNames = items.distinct( (item)=>item.lastName) ) ;
const distinctItems = items.distinct() ;

You can also use a Set instead of an Array to speed up the matching.

function distinct(items, mapper) {
    if (!mapper) mapper = (item)=>item;
    return items.map(mapper).reduce((acc, item) => {
        acc.add(item);
        return acc;
    }, new Set());
}

Solution 25 - Javascript

If you want to have an unique list of objects returned back. here is another alternative:

const unique = (arr, encoder=JSON.stringify, decoder=JSON.parse) =>
  [...new Set(arr.map(item => encoder(item)))].map(item => decoder(item));

Which will turn this:

unique([{"name": "john"}, {"name": "sarah"}, {"name": "john"}])

into

[{"name": "john"}, {"name": "sarah"}]

The trick here is that we are first encoding the items into strings using JSON.stringify, and then we are converting that to a Set (which makes the list of strings unique) and then we are converting it back to the original objects using JSON.parse.

Solution 26 - Javascript

    var array = 
    [
        {"name":"Joe", "age":17}, 
        {"name":"Bob", "age":17}, 
        {"name":"Carl", "age": 35}
    ]

    console.log(Object.keys(array.reduce((r,{age}) => (r[age]='', r) , {})))

Output:

Array ["17", "35"]

Solution 27 - Javascript

Just found this and I thought it's useful

_.map(_.indexBy(records, '_id'), function(obj){return obj})

Again using underscore, so if you have an object like this

var records = [{_id:1,name:'one', _id:2,name:'two', _id:1,name:'one'}]

it will give you the unique objects only.

What happens here is that indexBy returns a map like this

{ 1:{_id:1,name:'one'}, 2:{_id:2,name:'two'} }

and just because it's a map, all keys are unique.

Then I'm just mapping this list back to array.

In case you need only the distinct values

_.map(_.indexBy(records, '_id'), function(obj,key){return key})

Keep in mind that the key is returned as a string so, if you need integers instead, you should do

_.map(_.indexBy(records, '_id'), function(obj,key){return parseInt(key)})

Solution 28 - Javascript

i think you are looking for groupBy function (using Lodash)

_personsList = [{"name":"Joe", "age":17}, 
    			{"name":"Bob", "age":17}, 
    			{"name":"Carl", "age": 35}];
_uniqAgeList = _.groupBy(_personsList,"age");
_uniqAges = Object.keys(_uniqAgeList);

produces result:

17,35

jsFiddle demo:http://jsfiddle.net/4J2SX/201/

Solution 29 - Javascript

[...new Set([
    { "name": "Joe", "age": 17 },
    { "name": "Bob", "age": 17 },
    { "name": "Carl", "age": 35 }
  ].map(({ age }) => age))]

Solution 30 - Javascript

If you have Array.prototype.includes or are willing to polyfill it, this works:

var ages = []; array.forEach(function(x) { if (!ages.includes(x.age)) ages.push(x.age); });

Solution 31 - Javascript

If like me you prefer a more "functional" without compromising speed, this example uses fast dictionary lookup wrapped inside reduce closure.

var array = 
[	{"name":"Joe", "age":17}, 	{"name":"Bob", "age":17}, 	{"name":"Carl", "age": 35}]
var uniqueAges = array.reduce((p,c,i,a) => {
	if(!p[0][c.age]) {
		p[1].push(p[0][c.age] = c.age);
	}
	if(i<a.length-1) {
		return p
	} else {
		return p[1]
	}
}, [{},[]])

According to this test my solution is twice as fast as the proposed answer

Solution 32 - Javascript

I know my code is little length and little time complexity but it's understandable so I tried this way.

I'm trying to develop prototype based function here and code also change.

Here,Distinct is my own prototype function.

<script>
  var array = [{
      "name": "Joe",
      "age": 17
    },
    {
      "name": "Bob",
      "age": 17
    },
    {
      "name": "Carl",
      "age": 35
    }
  ]

  Array.prototype.Distinct = () => {
    var output = [];
    for (let i = 0; i < array.length; i++) {
      let flag = true;
      for (let j = 0; j < output.length; j++) {
        if (array[i].age == output[j]) {
          flag = false;
          break;
        }
      }
      if (flag)
        output.push(array[i].age);
    }
    return output;
  }
  //Distinct is my own function
  console.log(array.Distinct());
</script>

Solution 33 - Javascript

Primitive Types

var unique = [...new Set(array.map(item => item.pritiveAttribute))];

For complex types e.g. Objects

var unique = [...new DeepSet(array.map(item => item.Object))];

export class DeepSet extends Set {

  add (o: any) {
    for (let i of this)
      if (this.deepCompare(o, i))
        return this;
    super.add.call(this, o);
    return this;
  };

  private deepCompare(o: any, i: any) {
    return JSON.stringify(o) === JSON.stringify(i)
  }
}

Solution 34 - Javascript

Simple one-liner with great performance. 6% faster than the ES6 solutions in my tests.

var ages = array.map(function(o){return o.age}).filter(function(v,i,a) {
    return a.indexOf(v)===i
});

Solution 35 - Javascript

There are a lot of great answers here, but none of them have addressed the following line:

> Is there some way I could alternatively structure the data

I would create an object whose keys are the ages, each pointing to an array of names.

var array = [{ "name": "Joe", "age": 17 }, { "name": "Bob", "age": 17 }, { "name": "Carl", "age": 35 }];

var map = array.reduce(function(result, item) {
  result[item.age] = result[item.age] || [];
  result[item.age].push(item.name);
  return result;
}, {});

console.log(Object.keys(map));
console.log(map);

This way you've converted the data structure into one that is very easy to retrieve the distinct ages from.

Here is a more compact version that also stores the entire object instead of just the name (in case you are dealing with objects with more than 2 properties so they cant be stored as key and value).

var array = [{ "name": "Joe", "age": 17 }, { "name": "Bob", "age": 17 }, { "name": "Carl", "age": 35 }];

var map = array.reduce((r, i) => ((r[i.age] = r[i.age] || []).push(i), r), {});

console.log(Object.keys(map));
console.log(map);

Solution 36 - Javascript

const array = [{
    "name": "Joe",
    "age": 17
  },
  {
    "name": "Bob",
    "age": 17
  },
  {
    "name": "Carl",
    "age": 35
  }
]

const uniqueArrayByProperty = (array, callback) => {
  return array.reduce((prev, item) => {
    const v = callback(item);    
    if (!prev.includes(v)) prev.push(v)          
    return prev
  }, [])    
}

console.log(uniqueArrayByProperty(array, it => it.age));

Solution 37 - Javascript

My below code will show the unique array of ages as well as new array not having duplicate age

var data = [
  {"name": "Joe", "age": 17}, 
  {"name": "Bob", "age": 17}, 
  {"name": "Carl", "age": 35}
];

var unique = [];
var tempArr = [];
data.forEach((value, index) => {
	if (unique.indexOf(value.age) === -1) {
		unique.push(value.age);
	} else {
		tempArr.push(index);    
	}
});
tempArr.reverse();
tempArr.forEach(ele => {
	data.splice(ele, 1);
});
console.log('Unique Ages', unique);
console.log('Unique Array', data);```

Solution 38 - Javascript

I wrote my own in TypeScript, for a generic case, like that in Kotlin's Array.distinctBy {}...

function distinctBy<T, U extends string | number>(array: T[], mapFn: (el: T) => U) {
  const uniqueKeys = new Set(array.map(mapFn));
  return array.filter((el) => uniqueKeys.has(mapFn(el)));
}

Where U is hashable, of course. For Objects, you might need https://www.npmjs.com/package/es6-json-stable-stringify

Solution 39 - Javascript

In case you need unique of whole object

const _ = require('lodash');

var objects = [
  { 'x': 1, 'y': 2 },
  { 'y': 1, 'x': 2 },
  { 'x': 2, 'y': 1 },
  { 'x': 1, 'y': 2 }
];
 
_.uniqWith(objects, _.isEqual);

[Object {x: 1, y: 2}, Object {x: 2, y: 1}]

Solution 40 - Javascript

Answering this old question is pretty pointless, but there is a simple answer that speaks to the nature of Javascript. Objects in Javascript are inherently hash tables. We can use this to get a hash of unique keys:

var o = {}; array.map(function(v){ o[v.age] = 1; });

Then we can reduce the hash to an array of unique values:

var a2 = []; for (k in o){ a2.push(k); }

That is all you need. The array a2 contains just the unique ages.

Solution 41 - Javascript

const array = [
  { "name": "Joe", "age": 17 }, 
  { "name":"Bob", "age":17 },
  { "name":"Carl", "age": 35 }
]

const allAges = array.map(a => a.age);

const uniqueSet = new Set(allAges)
const uniqueArray = [...uniqueSet]

console.log(uniqueArray)

Solution 42 - Javascript

There is linq.js - LINQ for JavaScript package (npm install linq), that should be familiar for .Net developers.

Among others methods shown in samples there are distinct overloads.

An example to distinct objects by property value from an array of objects is

Enumerable.from(array).distinct(“$.id”).toArray();

From https://medium.com/@xmedeko/i-recommend-you-to-try-https-github-com-mihaifm-linq-20a4e3c090e9

Solution 43 - Javascript

I picked up random samples and tested it against the 100,000 items as below:

let array=[]
for (var i=1;i<100000;i++){

 let j= Math.floor(Math.random() * i) + 1
  array.push({"name":"Joe"+j, "age":j})
}

And here the performance result for each:

  Vlad Bezden Time:         === > 15ms
  Travis J Time: 25ms       === > 25ms 
  Niet the Dark Absol Time: === > 30ms
  Arun Saini Time:          === > 31ms
  Mrchief Time:             === > 54ms
  Ivan Nosov Time:          === > 14374ms

Also, I want to mention, since the items are generated randomly, the second place was iterating between Travis and Niet.

Solution 44 - Javascript

Let assume we have data something like this arr=[{id:1,age:17},{id:2,age:19} ...], then we can find unique objects like this -

function getUniqueObjects(ObjectArray) {
    let uniqueIds = new Set();
    const list = [...new Set(ObjectArray.filter(obj => {
        if (!uniqueIds.has(obj.id)) {
            uniqueIds.add(obj.id);
            return obj;
        }
    }))];

    return list;
}

Check here Codepen Link

Solution 45 - Javascript

Using new Ecma features are great but not all users have those available yet.

Following code will attach a new function named distinct to the Global Array object. If you are trying get distinct values of an array of objects, you can pass the name of the value to get the distinct values of that type.

Array.prototype.distinct = function(item){   var results = [];
for (var i = 0, l = this.length; i < l; i++)
    if (!item){
        if (results.indexOf(this[i]) === -1)
            results.push(this[i]);
        } else {
        if (results.indexOf(this[i][item]) === -1)
            results.push(this[i][item]);
    }
return results;};

Check out [my post][1] in CodePen for a demo. [1]: http://codepen.io/hsavran/pen/evPZOG

Solution 46 - Javascript

unique(obj, prop) {
	let result = [];
	let seen = new Set();

	Object.keys(obj)
		.forEach((key) => {
			let value = obj[key];

			let test = !prop
				? value
				: value[prop];

			!seen.has(test)
				&& seen.add(test)
				&& result.push(value);
		});

	return result;
}

Solution 47 - Javascript

Well you can use lodash to write a code which will be less verbose

Approach 1:Nested Approach

    let array = 
        [
            {"name":"Joe", "age":17}, 
            {"name":"Bob", "age":17}, 
            {"name":"Carl", "age": 35}
        ]
    let result = _.uniq(_.map(array,item=>item.age))

Approach 2: Method Chaining or Cascading method

    let array = 
        [
            {"name":"Joe", "age":17}, 
            {"name":"Bob", "age":17}, 
            {"name":"Carl", "age": 35}
        ]
    let result = _.chain(array).map(item=>item.age).uniq().value()

You can read about lodash's uniq() method from https://lodash.com/docs/4.17.15#uniq

Solution 48 - Javascript

The approach for getting a collection of distinct value from a group of keys.

You could take the given code from here and add a mapping for only the wanted keys to get an array of unique object values.

const listOfTags = [{ id: 1, label: "Hello", color: "red", sorting: 0 }, { id: 2, label: "World", color: "green", sorting: 1 }, { id: 3, label: "Hello", color: "blue", sorting: 4 }, { id: 4, label: "Sunshine", color: "yellow", sorting: 5 }, { id: 5, label: "Hello", color: "red", sorting: 6 }], keys = ['label', 'color'], filtered = listOfTags.filter( (s => o => (k => !s.has(k) && s.add(k)) (keys.map(k => o[k]).join('|')) )(new Set) ) result = filtered.map(o => Object.fromEntries(keys.map(k => [k, o[k]])));

console.log(result);

.as-console-wrapper { max-height: 100% !important; top: 0; }

Solution 49 - Javascript

Using a set and filter. This preserves order:

let unique = (items) => {
    const s = new Set();
    return items.filter((item) => {
      if (s.has(item)) {
        return false;
      }
      s.add(item);
      return true;
    });
  }
  
  console.log(
  unique(
      [
        'one', 'two', 'two', 'three', 'three', 'three'
      ]
    )
  );

/*
output:
[
  "one",
  "two",
  "three"
]
*/

Solution 50 - Javascript

If you're stuck using ES5, or you can't use new Set or new Map for some reason, and you need an array containing values with a unique key (and not just an array of unique keys), you can use the following:

function distinctBy(key, array) {
    var keys = array.map(function (value) { return value[key]; });
    return array.filter(function (value, index) { return keys.indexOf(value[key]) === index; });
}

Or the type-safe equivalent in TypeScript:

public distinctBy<T>(key: keyof T, array: T[]) {
    const keys = array.map(value => value[key]);
    return array.filter((value, index) => keys.indexOf(value[key]) === index);
}

Usage:

var distinctPeople = distinctBy('age', people);

All of the other answers either:

  • Return an array of unique keys instead of objects (like returning the list of ages instead of the people who have an unique age);
  • Use ES6, new Set, new Map etc. which might not be available to you;
  • Do not have a configurable key (like having .age hardcoded into the distinct function);
  • Assume the key can be used to index an array, which is not always true and TypeScript wouldn't allow it.

This answers does not have any of the four issues above.

Solution 51 - Javascript

If your array is object array, you can use this code.

getUniqueArray = (array: MyData[]) => {
    return array.filter((elem, index) => array.findIndex(obj => obj.value == elem.value) === index);
}

Where MyData is like as below:

export interface MyData{
    value: string,
    name: string
}

Note: You can't use Set because when objects are compared they are compared by reference and not by value. Therefore you need unique key for compare objects, in my example unique key is value field. For more details, you can visit this link : Filter an array for unique values in Javascript

Solution 52 - Javascript

let mobilePhones = [{id: 1, brand: "B1"}, {id: 2, brand: "B2"}, {id: 3, brand: "B1"}, {id: 4, brand: "B1"}, {id: 5, brand: "B2"}, {id: 6, brand: "B3"}]
 let allBrandsArr = mobilePhones .map(row=>{
        return  row.brand;
      });
let uniqueBrands =   allBrandsArr.filter((item, index, arry) => (arry.indexOf(item) === index));

console.log('uniqueBrands ', uniqueBrands );

Solution 53 - Javascript

Efficient and clean approach, using iter-ops library:

import {pipe, distinct, map} from 'iter-ops';

const array = 
    [
        {name: 'Joe', age: 17}, 
        {name: 'Bob', age: 17}, 
        {name: 'Carl', age: 35}
    ];

const i = pipe(
    array,
    distinct(a => a.age),
    map(m => m.age)
);

const uniqueAges = [...i]; //=> [17, 35]

Solution 54 - Javascript

Now we can Unique the Object on the base of same keys and same values

 const arr = [{"name":"Joe", "age":17},{"name":"Bob", "age":17}, {"name":"Carl", "age": 35},{"name":"Joe", "age":17}]
    let unique = []
     for (let char of arr) {
     let check = unique.find(e=> JSON.stringify(e) == JSON.stringify(char))
     if(!check) {
     unique.push(char)
     }
     }
    console.log(unique)

////outPut::: [{ name: "Joe", age: 17 }, { name: "Bob", age: 17 },{ name: "Carl", age: 35 }]

Solution 55 - Javascript

my two cents on this function:

var result = [];
for (var len = array.length, i = 0; i < len; ++i) {
  var age = array[i].age;
  if (result.indexOf(age) > -1) continue;
  result.push(age);
}

You can see the result here (Method 8) http://jsperf.com/distinct-values-from-array/3

Solution 56 - Javascript

If you would like to filter out duplicate values from an array on a known unique object property, you could use the following snippet:

let arr = [
  { "name": "Joe", "age": 17 },
  { "name": "Bob", "age": 17 },
  { "name": "Carl", "age": 35 },
  { "name": "Carl", "age": 35 }
];

let uniqueValues = [...arr.reduce((map, val) => {
    if (!map.has(val.name)) {
        map.set(val.name, val);
    }
    return map;
}, new Map()).values()]

Solution 57 - Javascript

this function can unique array and object

function oaunic(x,n=0){
    if(n==0) n = "elem";
    else n = "elem."+n;
    var uval = [];
    var unic = x.filter(function(elem, index, self){
        if(uval.indexOf(eval(n)) < 0){
            uval.push(eval(n));
            return index == self.indexOf(elem);
        }
    })
    return unic;
}

use that like this

tags_obj = [{name:"milad"},{name:"maziar"},{name:"maziar"}]
tags_arr = ["milad","maziar","maziar"]
console.log(oaunic(tags_obj,"name")) //for object
console.log(oaunic(tags_arr)) //for array

Solution 58 - Javascript

I know this is an old and relatively well-answered question and the answer I'm giving will get the complete-object back (Which I see suggested in a lot of the comments on this post). It may be "tacky" but in terms of readability seems a lot cleaner (although less efficient) than a lot of other solutions.

This will return a unique array of the complete objects inside the array.

let productIds = data.map(d => { 
   return JSON.stringify({ 
      id    : d.sku.product.productId,
      name  : d.sku.product.name,
      price : `${d.sku.product.price.currency} ${(d.sku.product.price.gross / d.sku.product.price.divisor).toFixed(2)}`
   })
})
productIds = [ ...new Set(productIds)].map(d => JSON.parse(d))```

Solution 59 - Javascript

using d3.js v3:

  ages = d3.set(
    array.map(function (d) { return d.age; })
  ).values();

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionRolandoView Question on Stackoverflow
Solution 1 - JavascriptVlad BezdenView Answer on Stackoverflow
Solution 2 - JavascriptIvan NosovView Answer on Stackoverflow
Solution 3 - JavascriptArun SainiView Answer on Stackoverflow
Solution 4 - JavascriptNiet the Dark AbsolView Answer on Stackoverflow
Solution 5 - JavascriptRussell VeaView Answer on Stackoverflow
Solution 6 - JavascriptTravis JView Answer on Stackoverflow
Solution 7 - JavascriptChristian MatthewView Answer on Stackoverflow
Solution 8 - JavascriptelclanrsView Answer on Stackoverflow
Solution 9 - Javascriptoleg gabureacView Answer on Stackoverflow
Solution 10 - JavascriptHarry StevensView Answer on Stackoverflow
Solution 11 - JavascriptRuben Morales FelixView Answer on Stackoverflow
Solution 12 - JavascriptAliReza BeigyView Answer on Stackoverflow
Solution 13 - JavascriptMrchiefView Answer on Stackoverflow
Solution 14 - JavascriptCiprianView Answer on Stackoverflow
Solution 15 - JavascriptEeveeView Answer on Stackoverflow
Solution 16 - JavascriptBaMView Answer on Stackoverflow
Solution 17 - JavascriptIvan NosovView Answer on Stackoverflow
Solution 18 - JavascriptJaison JamesView Answer on Stackoverflow
Solution 19 - JavascriptZeeView Answer on Stackoverflow
Solution 20 - JavascriptBoanergesView Answer on Stackoverflow
Solution 21 - JavascriptYash VekariaView Answer on Stackoverflow
Solution 22 - JavascriptDmitriy KupriyanovView Answer on Stackoverflow
Solution 23 - JavascriptRadosław KopczyńskiView Answer on Stackoverflow
Solution 24 - JavascriptSteven SpunginView Answer on Stackoverflow
Solution 25 - JavascriptSebastian KarlssonView Answer on Stackoverflow
Solution 26 - JavascriptcraftsmannadeemView Answer on Stackoverflow
Solution 27 - JavascriptsimoView Answer on Stackoverflow
Solution 28 - JavascriptAmil SajeevView Answer on Stackoverflow
Solution 29 - JavascriptMarian ZburleaView Answer on Stackoverflow
Solution 30 - JavascriptquillbreakerView Answer on Stackoverflow
Solution 31 - JavascriptbmaggiView Answer on Stackoverflow
Solution 32 - JavascriptPrabhatView Answer on Stackoverflow
Solution 33 - Javascriptfelix_tegView Answer on Stackoverflow
Solution 34 - JavascriptCraigView Answer on Stackoverflow
Solution 35 - Javascriptnick zoumView Answer on Stackoverflow
Solution 36 - JavascriptJose RestrepoView Answer on Stackoverflow
Solution 37 - JavascriptShridhar SagariView Answer on Stackoverflow
Solution 38 - JavascriptPolvView Answer on Stackoverflow
Solution 39 - JavascriptcegprakashView Answer on Stackoverflow
Solution 40 - JavascriptPreston L. BannisterView Answer on Stackoverflow
Solution 41 - JavascriptRuben Morales FelixView Answer on Stackoverflow
Solution 42 - JavascriptMichael FreidgeimView Answer on Stackoverflow
Solution 43 - JavascriptFerasView Answer on Stackoverflow
Solution 44 - JavascriptAkarsh SrivastavaView Answer on Stackoverflow
Solution 45 - JavascriptHasan SavranView Answer on Stackoverflow
Solution 46 - JavascriptDevonteView Answer on Stackoverflow
Solution 47 - JavascriptAkash SinghView Answer on Stackoverflow
Solution 48 - JavascriptNina ScholzView Answer on Stackoverflow
Solution 49 - Javascriptrobert kingView Answer on Stackoverflow
Solution 50 - JavascriptRudeyView Answer on Stackoverflow
Solution 51 - JavascriptRamil AliyevView Answer on Stackoverflow
Solution 52 - JavascriptUI_BrainView Answer on Stackoverflow
Solution 53 - Javascriptvitaly-tView Answer on Stackoverflow
Solution 54 - JavascriptMirza HayatView Answer on Stackoverflow
Solution 55 - JavascriptRafael HerscoviciView Answer on Stackoverflow
Solution 56 - JavascriptfelixyView Answer on Stackoverflow
Solution 57 - JavascriptmiladView Answer on Stackoverflow
Solution 58 - JavascriptConor ReidView Answer on Stackoverflow
Solution 59 - Javascriptalex.rindView Answer on Stackoverflow