Remove duplicate objects in an array of object in JavaScript

Question

Object1 = {connectorIndex: 1, nodeID: 6, Connectors: Object}
Object2 = {connectorIndex: 1, nodeID: 6, Connectors: Object}
Connector: {name: "ALAND", key: "", description: "Departure country (country from which the goods are sent)"}

There are two objects in same array. The connector objects are identical. How do I remove duplicate elements and get the final array with one object?

var array = [object 1, object 2];

object 2 is the duplicate to remove from the array.

Answer 1

this would do it if you are looking for exact matches:

function remove_duplicates(objectsArray) {
    var usedObjects = {};

    for (var i=objectsArray.length - 1;i>=0;i--) {
        var so = JSON.stringify(objectsArray[i]);

        if (usedObjects[so]) {
            objectsArray.splice(i, 1);

        } else {
            usedObjects[so] = true;          
        }
    }

    return objectsArray;

}

var objectsArray = [{a:'foo',b:'bar'}, {a:'foo',b:'bar'}];
var clean = remove_duplicates(objectsArray);

Answer 2

The challenge with using JSON.stringify is that if the object might contain a circular reference, then it will throw an exception, e.g.

var x1 = {};
x1.a = x1;
JSON.stringify(x1); // <- Uncaught TypeError: Converting circular structure to JSON

As alluded to however, if you are comparing objects and not values, then you can't just do an equality comparison, as this will always be false for different objects (even if they have the same properties with the same values).

If you were simply comparing values, then something like the below would work

var x = [1,2,2,3,4,2,6];  // Source list
var x2 = [];              // Will hold the de-duped result
x.forEach(function(elem){if(x2.indexOf(elem) === -1) x2.push(elem);});
x2;                       // <- [1, 2, 3, 4, 6]

If you want to compare object properties to one level you could write something like the below (there may be an easier way - just whipped this together)

function sameValues(o1, o2){
    for(p in o1){
        if(o1[p] !== o2[p]) return false;
    }
    for(p in o2){
        if(o2[p] !== o1[p]) return false;
    }
    return true;
}

var Object1 = {connectorIndex: 1, nodeID: 6, Connectors: Object};
var Object2 = {connectorIndex: 1, nodeID: 6, Connectors: Object};
var Object3 = {connectorIndex: 1, nodeID: 7, Connectors: Object};
var Object4 = {connectorIndex: 2, nodeID: 7, Connectors: Object};
var Object5 = {connectorIndex: 1, nodeID: 7, Connectors: Object};
var arr = [Object1, Object2, Object3, Object4, Object5];

var result = [];
arr.forEach(function(e1){
    if(!result.some(function(e2){return sameValues(e1,e2);})){
        // No existing object with same top level values in target array, so add
        result.push(e1);
    }
});
// result will have the 1st, 3rd, and 4th object only

Answer 3

This is how I prefer to remove duplicate objects from javascript array-

var fieldArray = [{ "name": "tom", "text": "tasty" },{ "name": "ram", "text": "rty" },{ "name": "ram", "text": "rty" },{ "name": "shyam", "text": "tasty" },{"name": "ram", "text": "rty" },{ "name": "tom", "text": "tasty" }];
fieldArray = fieldArray.reduce(function(field, e1){  
	var matches = field.filter(function(e2){return e1.name== e2.name}); 
	if (matches.length == 0){ 
		field.push(e1);  
	}return field;
}, []);
alert(JSON.stringify(fieldArray));

This works perfect for me.