How to merge two arrays in JavaScript and de-duplicate items
To just merge the arrays (without removing duplicates)
ES5 version use Array.concat
:
var array1 = ["Vijendra", "Singh"];var array2 = ["Singh", "Shakya"];console.log(array1.concat(array2));
ES6 version use destructuring
const array1 = ["Vijendra","Singh"];const array2 = ["Singh", "Shakya"];const array3 = [...array1, ...array2];
Since there is no 'built in' way to remove duplicates (ECMA-262 actually has Array.forEach
which would be great for this), we have to do it manually:
Array.prototype.unique = function() { var a = this.concat(); for(var i=0; i<a.length; ++i) { for(var j=i+1; j<a.length; ++j) { if(a[i] === a[j]) a.splice(j--, 1); } } return a;};
Then, to use it:
var array1 = ["Vijendra","Singh"];var array2 = ["Singh", "Shakya"];// Merges both arrays and gets unique itemsvar array3 = array1.concat(array2).unique();
This will also preserve the order of the arrays (i.e, no sorting needed).
Since many people are annoyed about prototype augmentation of Array.prototype
and for in
loops, here is a less invasive way to use it:
function arrayUnique(array) { var a = array.concat(); for(var i=0; i<a.length; ++i) { for(var j=i+1; j<a.length; ++j) { if(a[i] === a[j]) a.splice(j--, 1); } } return a;}var array1 = ["Vijendra","Singh"];var array2 = ["Singh", "Shakya"]; // Merges both arrays and gets unique itemsvar array3 = arrayUnique(array1.concat(array2));
For those who are fortunate enough to work with browsers where ES5 is available, you can use Object.defineProperty
like this:
Object.defineProperty(Array.prototype, 'unique', { enumerable: false, configurable: false, writable: false, value: function() { var a = this.concat(); for(var i=0; i<a.length; ++i) { for(var j=i+1; j<a.length; ++j) { if(a[i] === a[j]) a.splice(j--, 1); } } return a; }});
With Underscore.js or Lo-Dash you can do:
console.log(_.union([1, 2, 3], [101, 2, 1, 10], [2, 1]));
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.15/lodash.min.js"></script>
First concatenate the two arrays, next filter out only the unique items:
var a = [1, 2, 3], b = [101, 2, 1, 10]var c = a.concat(b)var d = c.filter((item, pos) => c.indexOf(item) === pos)console.log(d) // d is [1, 2, 3, 101, 10]
Edit
As suggested a more performance wise solution would be to filter out the unique items in b
before concatenating with a
:
var a = [1, 2, 3], b = [101, 2, 1, 10]var c = a.concat(b.filter((item) => a.indexOf(item) < 0))console.log(c) // c is [1, 2, 3, 101, 10]