I have two JavaScript arrays:
var array1 = ["Vijendra","Singh"];
var array2 = ["Singh", "Shakya"];
I want the output to be:
var array3 = ["Vijendra","Singh","Shakya"];
The output array should have repeated words removed.
How do I merge two arrays in JavaScript so that I get only the unique items from each array in the same order they were inserted into the original arrays?
This question is related to
javascript
arrays
merge
The answer is
Array.prototype.union = function (other_array) {
/* you can include a test to check whether other_array really is an array */
other_array.forEach(function(v) { if(this.indexOf(v) === -1) {this.push(v);}}, this);
}
The easiest way to do this is either to use concat() to merge the arrays and then use filter() to remove the duplicates, or to use concat() and then put the merged array inside a Set().
First way:
const firstArray = [1,2, 2];
const secondArray = [3,4];
// now lets merge them
const mergedArray = firstArray.concat(secondArray); // [1,2,2,3,4]
//now use filter to remove dups
const removeDuplicates = mergedArray.filter((elem, index) => mergedArray.indexOf(elem) === index); // [1,2,3, 4]
Second way (but with performance implications on the UI):
const firstArray = [1,2, 2];
const secondArray = [3,4];
// now lets merge them
const mergedArray = firstArray.concat(secondArray); // [1,2,2,3,4]
const removeDuplicates = new Set(mergedArray);
You can use loadash unionWith - _.unionWith([arrays], [comparator])
This method is like _.union except that it accepts comparator which is invoked to compare elements of arrays. Result values are chosen from the first array in which the value occurs. The comparator is invoked with two arguments: (arrVal, othVal).
var array1 = ["Vijendra","Singh"];_x000D_
var array2 = ["Singh", "Shakya"];_x000D_
_x000D_
var array3 = _.unionWith(array1, array2, _.isEqual);_x000D_
console.log(array3);<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.11/lodash.min.js"></script>looks like the accepted answer is the slowest in my tests;
note I am merging 2 arrays of objects by Key
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>JS Bin</title>
</head>
<body>
<button type='button' onclick='doit()'>do it</button>
<script>
function doit(){
var items = [];
var items2 = [];
var itemskeys = {};
for(var i = 0; i < 10000; i++){
items.push({K:i, C:"123"});
itemskeys[i] = i;
}
for(var i = 9000; i < 11000; i++){
items2.push({K:i, C:"123"});
}
console.time('merge');
var res = items.slice(0);
//method1();
method0();
//method2();
console.log(res.length);
console.timeEnd('merge');
function method0(){
for(var i = 0; i < items2.length; i++){
var isok = 1;
var k = items2[i].K;
if(itemskeys[k] == null){
itemskeys[i] = res.length;
res.push(items2[i]);
}
}
}
function method1(){
for(var i = 0; i < items2.length; i++){
var isok = 1;
var k = items2[i].K;
for(var j = 0; j < items.length; j++){
if(items[j].K == k){
isok = 0;
break;
}
}
if(isok) res.push(items2[i]);
}
}
function method2(){
res = res.concat(items2);
for(var i = 0; i < res.length; ++i) {
for(var j = i+1; j < res.length; ++j) {
if(res[i].K === res[j].K)
res.splice(j--, 1);
}
}
}
}
</script>
</body>
</html>
This is my second answer, but I believe the fastest? I'd like someone to check for me and reply in the comments.
My first attempt hit about 99k ops/sec and this go around is saying 390k ops/sec vs the other leading jsperf test of 140k (for me).
http://jsperf.com/merge-two-arrays-keeping-only-unique-values/26
I tried to minimize as much array interaction as possible this time around and it looked like I netted some performance.
function findMerge(a1, a2) {
var len1 = a1.length;
for (var x = 0; x < a2.length; x++) {
var found = false;
for (var y = 0; y < len1; y++) {
if (a2[x] === a1[y]) {
found = true;
break;
}
}
if(!found){
a1.push(a2.splice(x--, 1)[0]);
}
}
return a1;
}
Edit: I made some changes to my function, and the performance is drastic compared to others on the jsperf site.
The best and simplest way to do that is using the function "some()" of JavaScript that returns true or false indicating if the array contains the object's element. You can make this:
var array1 = ["Vijendra","Singh"];
var array2 = ["Singh", "Shakya"];
var array3 = array1;
array2.forEach(function(elementArray2){
var isEquals = array1.some(function(elementArray1){
return elementArray1 === elementArray2;
})
if(!isEquals){
array3.push(elementArray2);
}
});
console.log(array3);
The results:
["Vijendra", "Singh", "Shakya"]
ss you wish... without duplicate it...
Here is a slightly different take on the loop. With some of the optimizations in the latest version of Chrome, it is the fastest method for resolving the union of the two arrays (Chrome 38.0.2111).
http://jsperf.com/merge-two-arrays-keeping-only-unique-values
var array1 = ["Vijendra", "Singh"];
var array2 = ["Singh", "Shakya"];
var array3 = [];
var arr = array1.concat(array2),
len = arr.length;
while (len--) {
var itm = arr[len];
if (array3.indexOf(itm) === -1) {
array3.unshift(itm);
}
}
while loop: ~589k ops/s
filter: ~445k ops/s
lodash: 308k ops/s
for loops: 225k ops/s
A comment pointed out that one of my setup variables was causing my loop to pull ahead of the rest, because it didn't have to initialize an empty array to write to. I agree with that, so I've rewritten the test to even the playing field, and included an even faster option.
http://jsperf.com/merge-two-arrays-keeping-only-unique-values/52
let whileLoopAlt = function (array1, array2) {
const array3 = array1.slice(0);
let len1 = array1.length;
let len2 = array2.length;
const assoc = {};
while (len1--) {
assoc[array1[len1]] = null;
}
while (len2--) {
let itm = array2[len2];
if (assoc[itm] === undefined) { // Eliminate the indexOf call
array3.push(itm);
assoc[itm] = null;
}
}
return array3;
};
In this alternate solution, I've combined one answer's associative array solution to eliminate the .indexOf() call in the loop which was slowing things down a lot with a second loop, and included some of the other optimizations that other users have suggested in their answers as well.
The top answer here with the double loop on every value (i-1) is still significantly slower. lodash is still doing strong, and I still would recommend it to anyone who doesn't mind adding a library to their project. For those who don't want to, my while loop is still a good answer and the filter answer has a very strong showing here, beating out all on my tests with the latest Canary Chrome (44.0.2360) as of this writing.
Check out Mike's answer and Dan Stocker's answer if you want to step it up a notch in speed. Those are by far the fastest of all results after going through almost all of the viable answers.
var a = [1,2,3]
var b = [1,2,4,5]
I like one liners. This will push distinct b elements to a
b.forEach(item => a.includes(item) ? null : a.push(item));
And another version that will not modify a
var c = a.slice();
b.forEach(item => c.includes(item) ? null : c.push(item));
Assuming original arrays don't need de-duplication, this should be pretty fast, retain original order, and does not modify the original arrays...
function arrayMerge(base, addendum){
var out = [].concat(base);
for(var i=0,len=addendum.length;i<len;i++){
if(base.indexOf(addendum[i])<0){
out.push(addendum[i]);
}
}
return out;
}
usage:
var array1 = ["Vijendra","Singh"];
var array2 = ["Singh", "Shakya"];
var array3 = arrayMerge(array1, array2);
console.log(array3);
//-> [ 'Vijendra', 'Singh', 'Shakya' ]
var arr1 = [1, 3, 5, 6];
var arr2 = [3, 6, 10, 11, 12];
arr1.concat(arr2.filter(ele => !arr1.includes(ele)));
console.log(arr1);
output :- [1, 3, 5, 6, 10, 11, 12]
array1.concat(array2).filter((value, pos, arr)=>arr.indexOf(value)===pos)
The nice thing about this one is performance and that you in general, when working with arrays, are chaining methods like filter, map, etc so you can add that line and it will concat and deduplicate array2 with array1 without needing a reference to the later one (when you are chaining methods you don't have), example:
someSource()
.reduce(...)
.filter(...)
.map(...)
// and now you want to concat array2 and deduplicate:
.concat(array2).filter((value, pos, arr)=>arr.indexOf(value)===pos)
// and keep chaining stuff
.map(...)
.find(...)
// etc
(I don't like to pollute Array.prototype and that would be the only way of respect the chain - defining a new function will break it - so I think something like this is the only way of accomplish that)
In Dojo 1.6+
var unique = [];
var array1 = ["Vijendra","Singh"];
var array2 = ["Singh", "Shakya"];
var array3 = array1.concat(array2); // Merged both arrays
dojo.forEach(array3, function(item) {
if (dojo.indexOf(unique, item) > -1) return;
unique.push(item);
});
Update
See working code.
Given two sorted arrays of simple types without duplicates, this will merge them in O(n) time, and the output will be also sorted.
function merge(a, b) {
let i=0;
let j=0;
let c = [];
for (;;) {
if (i == a.length) {
if (j == b.length) return c;
c.push(b[j++]);
} else if (j == b.length || a[i] < b[j]) {
c.push(a[i++]);
} else {
if (a[i] == b[j]) ++i; // skip duplicates
c.push(b[j++]);
}
}
}
This is an ECMAScript 6 solution using spread operator and array generics.
Currently it only works with Firefox, and possibly Internet Explorer Technical Preview.
But if you use Babel, you can have it now.
const input = [_x000D_
[1, 2, 3],_x000D_
[101, 2, 1, 10],_x000D_
[2, 1]_x000D_
];_x000D_
const mergeDedupe = (arr) => {_x000D_
return [...new Set([].concat(...arr))];_x000D_
}_x000D_
_x000D_
console.log('output', mergeDedupe(input));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>If, like me, you need to support older browsers, this works with IE6+
function es3Merge(a, b) {
var hash = {},
i = (a = a.slice(0)).length,
e;
while (i--) {
hash[a[i]] = 1;
}
for (i = 0; i < b.length; i++) {
hash[e = b[i]] || a.push(e);
}
return a;
};
http://jsperf.com/merge-two-arrays-keeping-only-unique-values/22
I came across this post when trying to do the same thing, but I wanted to try something different. I just made up the function below. I also had another variable, 'compareKeys', (array of keys) for doing shallow object comparison. I'm going to probably change it to a function in the future.
Anyway, I didn't include that part, because it doesn't apply to the question. I also put my code into the jsperf going around. Edited: I fixed my entry in jsperf. My function gets about 99k ops/sec compared to 140k.
To the code: I first make an array of the available indices and then eliminate them by iterating over the first array. Finally, I push in the 'left-overs' by using the trimmed down array of indices that didn't match between the two arrays.
http://jsperf.com/merge-two-arrays-keeping-only-unique-values/26
function indiceMerge(a1, a2) {
var ai = [];
for (var x = 0; x < a2.length; x++) {
ai.push(x)
};
for (var x = 0; x < a1.length; x++) {
for (var y = 0; y < ai.length; y++) {
if (a1[x] === a2[ai[y]]) {
ai.splice(y, 1);
y--;
}
}
}
for (var x = 0; x < ai.length; x++) {
a1.push(a2[ai[x]]);
}
return a1;
}
First concatenate the two arrays, next filter out only the unique items:
var a = [1, 2, 3], b = [101, 2, 1, 10]_x000D_
var c = a.concat(b)_x000D_
var d = c.filter((item, pos) => c.indexOf(item) === pos)_x000D_
_x000D_
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]_x000D_
var c = a.concat(b.filter((item) => a.indexOf(item) < 0))_x000D_
_x000D_
console.log(c) // c is [1, 2, 3, 101, 10]Array.prototype.pushUnique = function(values)
{
for (var i=0; i < values.length; i++)
if (this.indexOf(values[i]) == -1)
this.push(values[i]);
};
Try:
var array1 = ["Vijendra","Singh"];
var array2 = ["Singh", "Shakya"];
array1.pushUnique(array2);
alert(array1.toString()); // Output: Vijendra,Singh,Shakya
There are so many solutions for merging two arrays. They can be divided into two main categories(except the use of 3rd party libraries like lodash or underscore.js).
a) combine two arrays and remove duplicated items.
b) filter out items before combining them.
Combine two arrays and remove duplicated items
Combining
// mutable operation(array1 is the combined array)
array1.push(...array2);
array1.unshift(...array2);
// immutable operation
const combined = array1.concat(array2);
const combined = [...array1, ...array2]; // ES6
Unifying
There are many ways to unifying an array, I personally suggest below two methods.
// a little bit tricky
const merged = combined.filter((item, index) => combined.indexOf(item) === index);
const merged = [...new Set(combined)];
Filter out items before combining them
There are also many ways, but I personally suggest the below code due to its simplicity.
const merged = array1.concat(array2.filter(secItem => !array1.includes(secItem)));
New solution ( which uses Array.prototype.indexOf and Array.prototype.concat ):
Array.prototype.uniqueMerge = function( a ) {
for ( var nonDuplicates = [], i = 0, l = a.length; i<l; ++i ) {
if ( this.indexOf( a[i] ) === -1 ) {
nonDuplicates.push( a[i] );
}
}
return this.concat( nonDuplicates )
};
Usage:
>>> ['Vijendra', 'Singh'].uniqueMerge(['Singh', 'Shakya'])
["Vijendra", "Singh", "Shakya"]
Array.prototype.indexOf ( for internet explorer ):
Array.prototype.indexOf = Array.prototype.indexOf || function(elt)
{
var len = this.length >>> 0;
var from = Number(arguments[1]) || 0;
from = (from < 0) ? Math.ceil(from): Math.floor(from);
if (from < 0)from += len;
for (; from < len; from++)
{
if (from in this && this[from] === elt)return from;
}
return -1;
};
If you do not want duplicates of a specific property (for example the ID)
let noDuplicate = array1.filter ( i => array2.findIndex(a => i.id==a.id)==-1 );
let result = [...noDuplicate, ...array2];
//Array.indexOf was introduced in javascript 1.6 (ECMA-262)
//We need to implement it explicitly for other browsers,
if (!Array.prototype.indexOf)
{
Array.prototype.indexOf = function(elt, from)
{
var len = this.length >>> 0;
for (; from < len; from++)
{
if (from in this &&
this[from] === elt)
return from;
}
return -1;
};
}
//now, on to the problem
var array1 = ["Vijendra","Singh"];
var array2 = ["Singh", "Shakya"];
var merged = array1.concat(array2);
var t;
for(i = 0; i < merged.length; i++)
if((t = merged.indexOf(i + 1, merged[i])) != -1)
{
merged.splice(t, 1);
i--;//in case of multiple occurrences
}
Implementation of indexOf method for other browsers is taken from MDC
You can do it simply with ECMAScript 6,
var array1 = ["Vijendra", "Singh"];
var array2 = ["Singh", "Shakya"];
var array3 = [...new Set([...array1 ,...array2])];
console.log(array3); // ["Vijendra", "Singh", "Shakya"];
- Use the spread operator for concatenating the array.
- Use Set for creating a distinct set of elements.
- Again use the spread operator to convert the Set into an array.
Use:
Array.prototype.merge = function (arr) {
var key;
for(key in arr)
this[key] = arr[key];
};
For n arrays, you can get the union like so.
function union(arrays) {
return new Set(arrays.flat()).keys();
};
A functional approach with ES2015
Following the functional approach a union of two Arrays is just the composition of concat and filter. In order to provide optimal performance we resort to the native Set data type, which is optimized for property lookups.
Anyway, the key question in conjunction with a union function is how to treat duplicates. The following permutations are possible:
Array A + Array B
[unique] + [unique]
[duplicated] + [unique]
[unique] + [duplicated]
[duplicated] + [duplicated]
The first two permutations are easy to handle with a single function. However, the last two are more complicated, since you can't process them as long as you rely on Set lookups. Since switching to plain old Object property lookups would entail a serious performance hit the following implementation just ignores the third and fourth permutation. You would have to build a separate version of union to support them.
// small, reusable auxiliary functions_x000D_
_x000D_
const comp = f => g => x => f(g(x));_x000D_
const apply = f => a => f(a);_x000D_
const flip = f => b => a => f(a) (b);_x000D_
const concat = xs => y => xs.concat(y);_x000D_
const afrom = apply(Array.from);_x000D_
const createSet = xs => new Set(xs);_x000D_
const filter = f => xs => xs.filter(apply(f));_x000D_
_x000D_
_x000D_
// de-duplication_x000D_
_x000D_
const dedupe = comp(afrom) (createSet);_x000D_
_x000D_
_x000D_
// the actual union function_x000D_
_x000D_
const union = xs => ys => {_x000D_
const zs = createSet(xs); _x000D_
return concat(xs) (_x000D_
filter(x => zs.has(x)_x000D_
? false_x000D_
: zs.add(x)_x000D_
) (ys));_x000D_
}_x000D_
_x000D_
_x000D_
// mock data_x000D_
_x000D_
const xs = [1,2,2,3,4,5];_x000D_
const ys = [0,1,2,3,3,4,5,6,6];_x000D_
_x000D_
_x000D_
// here we go_x000D_
_x000D_
console.log( "unique/unique", union(dedupe(xs)) (ys) );_x000D_
console.log( "duplicated/unique", union(xs) (ys) );From here on it gets trivial to implement an unionn function, which accepts any number of arrays (inspired by naomik's comments):
// small, reusable auxiliary functions_x000D_
_x000D_
const uncurry = f => (a, b) => f(a) (b);_x000D_
const foldl = f => acc => xs => xs.reduce(uncurry(f), acc);_x000D_
_x000D_
const apply = f => a => f(a);_x000D_
const flip = f => b => a => f(a) (b);_x000D_
const concat = xs => y => xs.concat(y);_x000D_
const createSet = xs => new Set(xs);_x000D_
const filter = f => xs => xs.filter(apply(f));_x000D_
_x000D_
_x000D_
// union and unionn_x000D_
_x000D_
const union = xs => ys => {_x000D_
const zs = createSet(xs); _x000D_
return concat(xs) (_x000D_
filter(x => zs.has(x)_x000D_
? false_x000D_
: zs.add(x)_x000D_
) (ys));_x000D_
}_x000D_
_x000D_
const unionn = (head, ...tail) => foldl(union) (head) (tail);_x000D_
_x000D_
_x000D_
// mock data_x000D_
_x000D_
const xs = [1,2,2,3,4,5];_x000D_
const ys = [0,1,2,3,3,4,5,6,6];_x000D_
const zs = [0,1,2,3,4,5,6,7,8,9];_x000D_
_x000D_
_x000D_
// here we go_x000D_
_x000D_
console.log( unionn(xs, ys, zs) );It turns out unionn is just foldl (aka Array.prototype.reduce), which takes union as its reducer. Note: Since the implementation doesn't use an additional accumulator, it will throw an error when you apply it without arguments.
Extremely fast
Using this discovery I create extremely fast solution for medium size arrays and compare performance with chosen solutions (I name my solution as K). This solution modify input arrays
function K(arr1,arr2) {
let r=[], h={};
while(arr1.length) {
let e = arr1.shift();
if(!h[e]) h[e]=1 && r.push(e);
}
while(arr2.length) {
let e = arr2.shift();
if(!h[e]) h[e]=1 && r.push(e);
}
return r;
}
// TEST
var array1 = ["Vijendra", "Singh"];
var array2 = ["Singh", "Shakya"];
console.log(K(array1,array2))Performance
Today 2020.10.15 I perform tests on MacOs HighSierra 10.13.6 on Chrome v86, Safari v13.1.2 and Firefox v81 for chosen solutions.
Results
For all browsers
- solution based on where-shift (K) is fastest (except small arrays on Safari where is fast) - for big arrays is >1000x faster than other solutions (!!!)
- solution F is fast (fastest on Safari) for small arrays
- solution M is slowest for small arrays
- solutions E,F,I are slowest for big arrays
We should note here that for very big arrays on Chrome the K solution can slow down - details here
Details
I perform 2 tests cases:
on solutions A, B, C, D, E, F, G, H, I, J, K (my), L, M presented in below snippet
// https://stackoverflow.com/a/10499519/860099
function A(arr1,arr2) {
return _.union(arr1,arr2)
}
// https://stackoverflow.com/a/53149853/860099
function B(arr1,arr2) {
return _.unionWith(arr1, arr2, _.isEqual);
}
// https://stackoverflow.com/a/27664971/860099
function C(arr1,arr2) {
return [...new Set([...arr1,...arr2])]
}
// https://stackoverflow.com/a/48130841/860099
function D(arr1,arr2) {
return Array.from(new Set(arr1.concat(arr2)))
}
// https://stackoverflow.com/a/23080662/860099
function E(arr1,arr2) {
return arr1.concat(arr2.filter((item) => arr1.indexOf(item) < 0))
}
// https://stackoverflow.com/a/60421828/860099
function F(array1, array2){
for (var i = 0; i < array2.length; i++)
if (array1.indexOf(array2[i]) === -1)
array1.push(array2[i]);
return array1;
}
// https://stackoverflow.com/a/28631880/860099
function G(arr1,arr2) {
var hash = {};
var i;
for (i = 0; i < arr1.length; i++) {
hash[arr1[i]] = true;
}
for (i = 0; i < arr2.length; i++) {
hash[arr2[i]] = true;
}
return Object.keys(hash);
}
// https://stackoverflow.com/a/13847481/860099
function H(a, b){
var hash = {};
var ret = [];
for(var i=0; i < a.length; i++){
var e = a[i];
if (!hash[e]){
hash[e] = true;
ret.push(e);
}
}
for(var i=0; i < b.length; i++){
var e = b[i];
if (!hash[e]){
hash[e] = true;
ret.push(e);
}
}
return ret;
}
// https://stackoverflow.com/a/32108675/860099
function I(a1, a2) {
var ai = [];
for (var x = 0; x < a2.length; x++) {
ai.push(x)
};
for (var x = 0; x < a1.length; x++) {
for (var y = 0; y < ai.length; y++) {
if (a1[x] === a2[ai[y]]) {
ai.splice(y, 1);
y--;
}
}
}
for (var x = 0; x < ai.length; x++) {
a1.push(a2[ai[x]]);
}
return a1;
}
// https://stackoverflow.com/a/1584377/860099
function J(arr1,arr2) {
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;
}
return arrayUnique(arr1.concat(arr2));
}
// my
function K(arr1,arr2) {
let r=[], h={};
while(arr1.length) {
let e = arr1.shift();
if(!h[e]) h[e]=1 && r.push(e);
}
while(arr2.length) {
let e = arr2.shift();
if(!h[e]) h[e]=1 && r.push(e);
}
return r;
}
// https://stackoverflow.com/a/25120770/860099
function L(array1, array2) {
const array3 = array1.slice(0);
let len1 = array1.length;
let len2 = array2.length;
const assoc = {};
while (len1--) {
assoc[array1[len1]] = null;
}
while (len2--) {
let itm = array2[len2];
if (assoc[itm] === undefined) { // Eliminate the indexOf call
array3.push(itm);
assoc[itm] = null;
}
}
return array3;
}
// https://stackoverflow.com/a/39336712/860099
function M(arr1,arr2) {
const comp = f => g => x => f(g(x));
const apply = f => a => f(a);
const flip = f => b => a => f(a) (b);
const concat = xs => y => xs.concat(y);
const afrom = apply(Array.from);
const createSet = xs => new Set(xs);
const filter = f => xs => xs.filter(apply(f));
const dedupe = comp(afrom) (createSet);
const union = xs => ys => {
const zs = createSet(xs);
return concat(xs) (
filter(x => zs.has(x)
? false
: zs.add(x)
) (ys));
}
return union(dedupe(arr1)) (arr2)
}
// -------------
// TEST
// -------------
var array1 = ["Vijendra","Singh"];
var array2 = ["Singh", "Shakya"];
[A,B,C,D,E,F,G,H,I,J,K,L,M].forEach(f=> {
console.log(`${f.name} [${f([...array1],[...array2])}]`);
})<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.20/lodash.min.js" integrity="sha512-90vH1Z83AJY9DmlWa8WkjkV79yfS2n2Oxhsi2dZbIv0nC4E6m5AbH8Nh156kkM7JePmqD6tcZsfad1ueoaovww==" crossorigin="anonymous"></script>
This shippet only presents functions used in performance tests - it not perform tests itself!And here are example test run for chrome
This is fast, collates any number of arrays, and works with both numbers and strings.
function collate(a){ // Pass an array of arrays to collate into one array
var h = { n: {}, s: {} };
for (var i=0; i < a.length; i++) for (var j=0; j < a[i].length; j++)
(typeof a[i][j] === "number" ? h.n[a[i][j]] = true : h.s[a[i][j]] = true);
var b = Object.keys(h.n);
for (var i=0; i< b.length; i++)
b[i]=Number(b[i]);
return b.concat(Object.keys(h.s));
}
> a = [ [1,2,3], [3,4,5], [1,5,6], ["spoon", "fork", "5"] ]
> collate( a )
[1, 2, 3, 4, 5, 6, "5", "spoon", "fork"]
If you don't need to distinguish between 5 and "5", then
function collate(a){
var h = {};
for (i=0; i < a.length; i++) for (var j=0; j < a[i].length; j++)
h[a[i][j]] = typeof a[i][j] === "number";
for (i=0, b=Object.keys(h); i< b.length; i++)
if (h[b[i]])
b[i]=Number(b[i]);
return b;
}
[1, 2, 3, 4, "5", 6, "spoon", "fork"]
will do.
And if you don't mind (or would prefer) all values ending up as strings anyway then just this:
function collate(a){
var h = {};
for (var i=0; i < a.length; i++)
for (var j=0; j < a[i].length; j++)
h[a[i][j]] = true;
return Object.keys(h)
}
["1", "2", "3", "4", "5", "6", "spoon", "fork"]
If you don't actually need an array, but just want to collect the unique values and iterate over them, then (in most browsers (and node.js)):
h = new Map();
for (i=0; i < a.length; i++)
for (var j=0; j < a[i].length; j++)
h.set(a[i][j]);
It might be preferable.
One line solution as a segue to LiraNuna's:
let array1 = ["Vijendra","Singh"];
let array2 = ["Singh", "Shakya"];
// Merges both arrays
let array3 = array1.concat(array2);
//REMOVE DUPLICATE
let removeDuplicate = [...new Set(array3)];
console.log(removeDuplicate);
Here is my solution https://gist.github.com/4692150 with deep equals and easy to use result:
function merge_arrays(arr1,arr2)
{
...
return {first:firstPart,common:commonString,second:secondPart,full:finalString};
}
console.log(merge_arrays(
[
[1,"10:55"] ,
[2,"10:55"] ,
[3,"10:55"]
],[
[3,"10:55"] ,
[4,"10:55"] ,
[5,"10:55"]
]).second);
result:
[
[4,"10:55"] ,
[5,"10:55"]
]
const merge(...args)=>(new Set([].concat(...args)))
For ES6, just one line:
a = [1, 2, 3, 4]
b = [4, 5]
[...new Set(a.concat(b))] // [1, 2, 3, 4, 5]
Just wrote before for the same reason (works with any amount of arrays):
/**
* Returns with the union of the given arrays.
*
* @param Any amount of arrays to be united.
* @returns {array} The union array.
*/
function uniteArrays()
{
var union = [];
for (var argumentIndex = 0; argumentIndex < arguments.length; argumentIndex++)
{
eachArgument = arguments[argumentIndex];
if (typeof eachArgument !== 'array')
{
eachArray = eachArgument;
for (var index = 0; index < eachArray.length; index++)
{
eachValue = eachArray[index];
if (arrayHasValue(union, eachValue) == false)
union.push(eachValue);
}
}
}
return union;
}
function arrayHasValue(array, value)
{ return array.indexOf(value) != -1; }
Another approach for your review with reduce func:
function mergeDistinct(arResult, candidate){
if (-1 == arResult.indexOf(candidate)) {
arResult.push(candidate);
}
return arResult;
}
var array1 = ["Vijendra","Singh"];
var array2 = ["Singh", "Shakya"];
var arMerge = [];
arMerge = array1.reduce(mergeDistinct, arMerge);
arMerge = array2.reduce(mergeDistinct, arMerge);//["Vijendra","Singh","Shakya"];
This is simple and can be done in one line with jQuery:
var arr1 = ['Vijendra', 'Singh'], arr2 =['Singh', 'Shakya'];
$.unique(arr1.concat(arr2))//one line
["Vijendra", "Singh", "Shakya"]
ES6
array1.push(...array2) // => don't remove duplication
OR
[...array1,...array2] // => don't remove duplication
OR
[...new Set([...array1 ,...array2])]; // => remove duplication
Usage: https://gist.github.com/samad-aghaei/7250ffb74ed80732debb1cbb14d2bfb0
var _uniqueMerge = function(opts, _ref){
for(var key in _ref)
if (_ref && _ref[key] && _ref[key].constructor && _ref[key].constructor === Object)
_ref[key] = _uniqueMerge((opts ? opts[key] : null), _ref[key] );
else if(opts && opts.hasOwnProperty(key))
_ref[key] = opts[key];
else _ref[key] = _ref[key][1];
return _ref;
}
function set(a, b) {
return a.concat(b).filter(function(x,i,c) { return c.indexOf(x) == i; });
}
for the sake of it... here is a single line solution:
const x = [...new Set([['C', 'B'],['B', 'A']].reduce( (a, e) => a.concat(e), []))].sort()
// ['A', 'B', 'C']
Not particularly readable but it may help someone:
- Applies a reduce function with the initial accumulator value set to an empty array.
- The reduce function uses concat to append each sub-array onto the accumulator array.
- The result of this is passed as a constructor parameter to create a new
Set. - The spread operator is used to convert the
Setto an array. - The
sort()function is applied to the new array.
You can merge the results and filter the duplicates:
let combinedItems = [];
// items is an Array of arrays: [[1,2,3],[1,5,6],...]
items.forEach(currItems => {
if (currItems && currItems.length > 0) {
combinedItems = combinedItems.concat(currItems);
}
});
let noDuplicateItems = combinedItems.filter((item, index) => {
return !combinedItems.includes(item, index + 1);
});
Just throwing in my two cents.
function mergeStringArrays(a, b){
var hash = {};
var ret = [];
for(var i=0; i < a.length; i++){
var e = a[i];
if (!hash[e]){
hash[e] = true;
ret.push(e);
}
}
for(var i=0; i < b.length; i++){
var e = b[i];
if (!hash[e]){
hash[e] = true;
ret.push(e);
}
}
return ret;
}
This is a method I use a lot, it uses an object as a hashlookup table to do the duplicate checking. Assuming that the hash is O(1), then this runs in O(n) where n is a.length + b.length. I honestly have no idea how the browser does the hash, but it performs well on many thousands of data points.
Here an option for objects with object arrays:
const a = [{param1: "1", param2: 1},{param1: "2", param2: 2},{param1: "4", param2: 4}]
const b = [{param1: "1", param2: 1},{param1: "4", param2: 5}]
var result = a.concat(b.filter(item =>
!JSON.stringify(a).includes(JSON.stringify(item))
));
console.log(result);
//Result [{param1: "1", param2: 1},{param1: "2", param2: 2},{param1: "4", param2: 4},{param1: "4", param2: 5}]
You can achieve it simply using Underscore.js's => uniq:
array3 = _.uniq(array1.concat(array2))
console.log(array3)
It will print ["Vijendra", "Singh", "Shakya"].
Simplified best of this answer and turned it into a nice function:
function mergeUnique(arr1, arr2){
return arr1.concat(arr2.filter(function (item) {
return arr1.indexOf(item) === -1;
}));
}
It can be done using Set.
var array1 = ["Vijendra","Singh"];_x000D_
var array2 = ["Singh", "Shakya"];_x000D_
_x000D_
var array3 = array1.concat(array2);_x000D_
var tempSet = new Set(array3);_x000D_
array3 = Array.from(tempSet);_x000D_
_x000D_
//show output_x000D_
document.body.querySelector("div").innerHTML = JSON.stringify(array3);<div style="width:100%;height:4rem;line-height:4rem;background-color:steelblue;color:#DDD;text-align:center;font-family:Calibri" > _x000D_
temp text _x000D_
</div>DeDuplicate single or Merge and DeDuplicate multiple array inputs. Example below.
useing ES6 - Set, for of, destructuring
I wrote this simple function which takes multiple array arguments. Does pretty much the same as the solution above it just have more practical use case. This function doesn't concatenate duplicate values in to one array only so that it can delete them at some later stage.
SHORT FUNCTION DEFINITION ( only 9 lines )
/**
* This function merging only arrays unique values. It does not merges arrays in to array with duplicate values at any stage.
*
* @params ...args Function accept multiple array input (merges them to single array with no duplicates)
* it also can be used to filter duplicates in single array
*/
function arrayDeDuplicate(...args){
let set = new Set(); // init Set object (available as of ES6)
for(let arr of args){ // for of loops through values
arr.map((value) => { // map adds each value to Set object
set.add(value); // set.add method adds only unique values
});
}
return [...set]; // destructuring set object back to array object
// alternativly we culd use: return Array.from(set);
}
USE EXAMPLE CODEPEN:
// SCENARIO
let a = [1,2,3,4,5,6];
let b = [4,5,6,7,8,9,10,10,10];
let c = [43,23,1,2,3];
let d = ['a','b','c','d'];
let e = ['b','c','d','e'];
// USEAGE
let uniqueArrayAll = arrayDeDuplicate(a, b, c, d, e);
let uniqueArraySingle = arrayDeDuplicate(b);
// OUTPUT
console.log(uniqueArrayAll); // [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 43, 23, "a", "b", "c", "d", "e"]
console.log(uniqueArraySingle); // [4, 5, 6, 7, 8, 9, 10]
I think this works faster.
removeDup = a => {
for (let i = a.length - 1; i >= 0; i--) {
for (let j = i-1; j >= 0; j--) {
if (a[i] === a[j])
a.splice(j--, 1);
}
}
return a;
}
Reduce them !!!
This alternative instead of merging and deduplicating explicitly it will take one array and reduce it with another array so that each value of the first array can be iterated and destructured in an accumulative behavior, ignoring the already included values by exploiting the persistence of the array because of the recursiveness.
array2.reduce(reducer, array1.reduce(reducer, []))
Test Example:
var array1 = ["Vijendra","Singh","Singh"];_x000D_
var array2 = ["Singh", "Shakya", "Shakya"];_x000D_
const reducer = (accumulator, currentValue) => accumulator.includes(currentValue) ? accumulator : [...accumulator, currentValue];_x000D_
_x000D_
console.log(_x000D_
array2.reduce(reducer, array1.reduce(reducer, []))_x000D_
);_x000D_
_x000D_
// a reduce on first array is needed to ensure a deduplicated array used as initial value on the second array being reducedConclusion
By far more elegant and useful when boring for-each approach wants to be avoided (not that it is not useful).
Deals with the concat() limitations on deduplication.
No need for external libraries like Underscore.js, JQuery or Lo-Dash, nor the trouble to create any built-in function to achieve the desired merged and deduplicated effect.
Oh, and HEY!, it can be done as a one-liner!!!
This answered was possible thanks to ES5 (ECMAScript 2015), beautiful include() and gorgeous reduce().
My one and a half penny:
Array.prototype.concat_n_dedupe = function(other_array) {
return this
.concat(other_array) // add second
.reduce(function(uniques, item) { // dedupe all
if (uniques.indexOf(item) == -1) {
uniques.push(item);
}
return uniques;
}, []);
};
var array1 = ["Vijendra","Singh"];
var array2 = ["Singh", "Shakya"];
var result = array1.concat_n_dedupe(array2);
console.log(result);
Array.prototype.merge = function(/* variable number of arrays */){
for(var i = 0; i < arguments.length; i++){
var array = arguments[i];
for(var j = 0; j < array.length; j++){
if(this.indexOf(array[j]) === -1) {
this.push(array[j]);
}
}
}
return this;
};
A much better array merge function.
Here is about the most effective one, in terms of computation time. Also it keeps the initial order of elements.
First filter all duplicates from second array, then concatenate what is left to the first one.
var a = [1,2,3];
var b = [5,4,3];
var c = a.concat(b.filter(function(i){
return a.indexOf(i) == -1;
}));
console.log(c); // [1, 2, 3, 5, 4]
Here is slightly improved (faster) version of it, with a downside, that arrays must not miss values:
var i, c = a.slice(), ci = c.length;
for(i = 0; i < b.length; i++){
if(c.indexOf(b[i]) == -1)
c[ci++] = b[i];
}
Using Lodash
I found @GijsjanB's answer useful but my arrays contained objects that had many attributes, so I had to de-duplicate them using one of the attributes.
Here's my solution using lodash
userList1 = [{ id: 1 }, { id: 2 }, { id: 3 }]
userList2 = [{ id: 3 }, { id: 4 }, { id: 5 }]
// id 3 is repeated in both arrays
users = _.unionWith(userList1, userList2, function(a, b){ return a.id == b.id });
// users = [{ id: 1 }, { id: 2 }, { id: 3 }, { id: 4 }, { id: 5 }]
The function you pass as the third parameter has two arguments (two elements), and it must return true if they are equal.
Using a Set (ECMAScript 2015), it will be as simple as that:
const array1 = ["Vijendra", "Singh"];_x000D_
const array2 = ["Singh", "Shakya"];_x000D_
console.log(Array.from(new Set(array1.concat(array2))));Merge an unlimited number of arrays or non-arrays and keep it unique:
function flatMerge() {
return Array.prototype.reduce.call(arguments, function (result, current) {
if (!(current instanceof Array)) {
if (result.indexOf(current) === -1) {
result.push(current);
}
} else {
current.forEach(function (value) {
console.log(value);
if (result.indexOf(value) === -1) {
result.push(value);
}
});
}
return result;
}, []);
}
flatMerge([1,2,3], 4, 4, [3, 2, 1, 5], [7, 6, 8, 9], 5, [4], 2, [3, 2, 5]);
// [1, 2, 3, 4, 5, 7, 6, 8, 9]
flatMerge([1,2,3], [3, 2, 1, 5], [7, 6, 8, 9]);
// [1, 2, 3, 5, 7, 6, 8, 9]
flatMerge(1, 3, 5, 7);
// [1, 3, 5, 7]
var array1 = ["one","two"];_x000D_
var array2 = ["two", "three"];_x000D_
var collectionOfTwoArrays = [...array1, ...array2]; _x000D_
var uniqueList = array => [...new Set(array)];_x000D_
console.log('Collection :');_x000D_
console.log(collectionOfTwoArrays); _x000D_
console.log('Collection without duplicates :');_x000D_
console.log(uniqueList(collectionOfTwoArrays));var MergeArrays=function(arrayOne, arrayTwo, equalityField) {
var mergeDictionary = {};
for (var i = 0; i < arrayOne.length; i++) {
mergeDictionary[arrayOne[i][equalityField]] = arrayOne[i];
}
for (var i = 0; i < arrayTwo.length; i++) {
mergeDictionary[arrayTwo[i][equalityField]] = arrayTwo[i];
}
return $.map(mergeDictionary, function (value, key) { return value });
}
Leveraging dictionaries and Jquery you could merge the two arrays and not get duplicates. In my example I'm using a given field on the object but could be just the object itself.
If you're purely using underscore.js, it doesn't have unionWith, unionBy
you can try out :
_.uniq(_.union(arr1, arr2), (obj) => obj.key)
( key is the key param of each object )
this should help to get unique after union of both arrays.
Based on jsperf, the fastest way to merge two arrays in a new one is the following:
for (var i = 0; i < array2.length; i++)
if (array1.indexOf(array2[i]) === -1)
array1.push(array2[i]);
This one is 17% slower:
array2.forEach(v => array1.includes(v) ? null : array1.push(v));
This one is 45% slower:
var a = [...new Set([...array1 ,...array2])];
And the accepted answers is 55% slower (and much longer to write)
var a = array1.concat(array2);
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);
}
}
Here is a simple example:
var unique = function(array) {
var unique = []
for (var i = 0; i < array.length; i += 1) {
if (unique.indexOf(array[i]) == -1) {
unique.push(array[i])
}
}
return unique
}
var uniqueList = unique(["AAPL", "MSFT"].concat(["MSFT", "BBEP", "GE"]));
We define unique(array) to remove redundant elements and use the concat function to combine two arrays.
I learned a cheeky little way to concatenate two arrays with the spread operator:
var array1 = ['tom', 'dick', 'harry'];
var array2 = ['martin', 'ricky'];
array1.push(...array2);
The "..." spread operator splits the following array into individual items and then push can handle them as separate arguments.
Take two arrays a and b
var a = ['a','b','c'];
var b = ['d','e','f'];
var c = a.concat(b);
//c is now an an array with: ['a','b','c','d','e','f']
Better option for large inputs will be to sort arrays. Then merge them.
function sortFunction(a, b) {
return a - b;
}
arr1.sort(sortFunction);
arr2.sort(sortFunction);
function mergeDedup(arr1, arr2) {
var i = 0, j = 0, result = [];
while (i < arr1.length && j < arr2.length) {
if (arr1[i] < arr2[j]) {
writeIfNotSameAsBefore(result, arr1[i]);
i++;
}
else if (arr1[i] > arr2[j]) {
writeIfNotSameAsBefore(result, arr2[j]);
j++;
}
else {
writeIfNotSameAsBefore(result, arr1[i]);
i++;
j++;
}
}
while (i < arr1.length) {
writeIfNotSameAsBefore(result, arr1[i]);
i++;
}
while (j < arr2.length) {
writeIfNotSameAsBefore(result, arr2[j]);
j++;
}
return result;
}
function writeIfNotSameAsBefore(arr, item) {
if (arr[arr.length - 1] !== item) {
arr[arr.length] = item;
}
return arr.length;
}
Sorting will take O(nlogn + mlogm), where n and m are length of the arrays, and O(x) for merging, where x = Max(n, m);
//1.merge two array into one array
var arr1 = [0, 1, 2, 4];
var arr2 = [4, 5, 6];
//for merge array we use "Array.concat"
let combineArray = arr1.concat(arr2); //output
alert(combineArray); //now out put is 0,1,2,4,4,5,6 but 4 reapeat
//2.same thing with "Spread Syntex"
let spreadArray = [...arr1, ...arr2];
alert(spreadArray); //now out put is 0,1,2,4,4,5,6 but 4 reapete
/*
if we need remove duplicate element method use are
1.Using set
2.using .filter
3.using .reduce
*/
Built a tester to check just how fast some of the performance oriented answers are. Feel free to add some more. So far, Set is both the simplest and fastest option (by bigger margins as the number of records increases), at least with simple Number types.
const records = 10000, //max records per array
max_int = 100, //max integer value per array
dup_rate = .5; //rate of duplication
let perf = {}, //performance logger,
ts = 0,
te = 0,
array1 = [], //init arrays
array2 = [],
array1b = [],
array2b = [],
a = [];
//populate randomized arrays
for (let i = 0; i < records; i++) {
let r = Math.random(),
n = r * max_int;
if (Math.random() < .5) {
array1.push(n);
r < dup_rate && array2.push(n);
} else {
array2.push(n);
r < dup_rate && array1.push(n);
}
}
//simple deep copies short of rfdc, in case someone wants to test with more complex data types
array1b = JSON.parse(JSON.stringify(array1));
array2b = JSON.parse(JSON.stringify(array2));
console.log('Records in Array 1:', array1.length, array1b.length);
console.log('Records in Array 2:', array2.length, array2b.length);
//test method 1 (jsperf per @Pitouli)
ts = performance.now();
for (let i = 0; i < array2.length; i++)
if (array1.indexOf(array2[i]) === -1)
array1.push(array2[i]); //modifies array1
te = performance.now();
perf.m1 = te - ts;
console.log('Method 1 merged', array1.length, 'records in:', perf.m1);
array1 = JSON.parse(JSON.stringify(array1b)); //reset array1
//test method 2 (classic forEach)
ts = performance.now();
array2.forEach(v => array1.includes(v) ? null : array1.push(v)); //modifies array1
te = performance.now();
perf.m2 = te - ts;
console.log('Method 2 merged', array1.length, 'records in:', perf.m2);
//test method 3 (Simplest native option)
ts = performance.now();
a = [...new Set([...array1, ...array2])]; //does not modify source arrays
te = performance.now();
perf.m3 = te - ts;
console.log('Method 3 merged', a.length, 'records in:', perf.m3);
//test method 4 (Selected Answer)
ts = performance.now();
a = array1.concat(array2); //does not modify source arrays
for (let i = 0; i < a.length; ++i) {
for (let j = i + 1; j < a.length; ++j) {
if (a[i] === a[j])
a.splice(j--, 1);
}
}
te = performance.now();
perf.m4 = te - ts;
console.log('Method 4 merged', a.length, 'records in:', perf.m4);
//test method 5 (@Kamil Kielczewski)
ts = performance.now();
function K(arr1, arr2) {
let r = [],
h = {};
while (arr1.length) {
let e = arr1.shift(); //modifies array1
if (!h[e]) h[e] = 1 && r.push(e);
}
while (arr2.length) {
let e = arr2.shift(); //modifies array2
if (!h[e]) h[e] = 1 && r.push(e);
}
return r;
}
a = K(array1, array2);
te = performance.now();
perf.m5 = te - ts;
console.log('Method 5 merged', a.length, 'records in:', perf.m4);
array1 = JSON.parse(JSON.stringify(array1b)); //reset array1
array2 = JSON.parse(JSON.stringify(array2b)); //reset array2
for (let i = 1; i < 6; i++) {
console.log('Method:', i, 'speed is', (perf['m' + i] / perf.m1 * 100).toFixed(2), '% of Method 1');
}ES2019
You can use it like union(array1, array2, array3, ...)
/**
* Merges two or more arrays keeping unique items. This method does
* not change the existing arrays, but instead returns a new array.
*/
function union<T>(...arrays: T[]) {
return [...new Set([...arrays].flat())];
}
It is ES2019 because of the flat() function, but you can use core-js to get it as a polyfill. The T here is TypeScript generic type, that you can remove if you are not using TypeScript. If you are using TypeScript, make sure to add "lib": ["es2019.array"] to compiler options in tsconfig.json.
or...
just use lodash _.union
Array.prototype.add = function(b){
var a = this.concat(); // clone current object
if(!b.push || !b.length) return a; // if b is not an array, or empty, then return a unchanged
if(!a.length) return b.concat(); // if original is empty, return b
// go through all the elements of b
for(var i = 0; i < b.length; i++){
// if b's value is not in a, then add it
if(a.indexOf(b[i]) == -1) a.push(b[i]);
}
return a;
}
// Example:
console.log([1,2,3].add([3, 4, 5])); // will output [1, 2, 3, 4, 5]
If you merging object arrays, consider use of lodash UnionBy function, it allows you to set custom predicate compare objects:
import { unionBy } from 'lodash';
const a = [{a: 1, b: 2}];
const b = [{a: 1, b: 3}];
const c = [{a: 2, b: 4}];
const result = UnionBy(a,b,c, x => x.a);
Result is: [{ a: 1; b: 2 }, { a: 2; b: 4 }]
First passed match from arrays is used in result
The simplest solution with filter:
var array1 = ["Vijendra","Singh"];
var array2 = ["Singh", "Shakya"];
var mergedArrayWithoutDuplicates = array1.concat(
array2.filter(seccondArrayItem => !array1.includes(seccondArrayItem))
);
Why don't you use an object? It looks like you're trying to model a set. This won't preserve the order, however.
var set1 = {"Vijendra":true, "Singh":true}
var set2 = {"Singh":true, "Shakya":true}
// Merge second object into first
function merge(set1, set2){
for (var key in set2){
if (set2.hasOwnProperty(key))
set1[key] = set2[key]
}
return set1
}
merge(set1, set2)
// Create set from array
function setify(array){
var result = {}
for (var item in array){
if (array.hasOwnProperty(item))
result[array[item]] = true
}
return result
}
You can try this:
const union = (a, b) => Array.from(new Set([...a, ...b]));_x000D_
_x000D_
console.log(union(["neymar","messi"], ["ronaldo","neymar"]));Modular, General
This could be achieved by composing two essential functions.
const getUniqueMerge = (...arrs) => getUniqueArr(mergeArrs(...arrs))
const getUniqueArr = (array) => Array.from(new Set(array))
const mergeArrs = (...arrs) => [].concat(...arrs)
It can handle unlimited arrays, or values
console.log(getUniqueMerge(["Vijendra","Singh"],["Singh", "Shakya"])
// ["Vijendra", "Singh", "Shakya"]
console.log(getUniqueMerge(["Sheldon", "Cooper"], ["and", "Cooper", "Amy", "and"], "Farrah", "Amy", "Fowler"))
// ["Sheldon", "Cooper", "and", "Amy", "Farrah", "Fowler"]
This is the function I use when I need to merge, (or return the union of) two arrays.
var union = function (a, b) {
for (var i = 0; i < b.length; i++)
if (a.indexOf(b[i]) === -1)
a.push(b[i]);
return a;
};
var a = [1, 2, 3, 'a', 'b', 'c'];
var b = [2, 3, 4, 'b', 'c', 'd'];
a = union(a, b);
//> [1, 2, 3, "a", "b", "c", 4, "d"]
var array1 = ["Vijendra", "Singh"];
var array2 = ["Singh", "Shakya"];
var array3 = union(array1, array2);
//> ["Vijendra", "Singh", "Shakya"]
If you want to check for unique objects, then use JSON.stringify in your comparison.
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(JSON.stringify(a[i]) === JSON.stringify(a[j]))
a.splice(j--, 1);
}
}
return a;
}
I know this question is not about array of objects, but searchers do end up here.
so it's worth adding for future readers a proper ES6 way of merging and then removing duplicates
array of objects:
var arr1 = [ {a: 1}, {a: 2}, {a: 3} ];
var arr2 = [ {a: 1}, {a: 2}, {a: 4} ];
var arr3 = arr1.concat(arr2.filter( ({a}) => !arr1.find(f => f.a == a) ));
// [ {a: 1}, {a: 2}, {a: 3}, {a: 4} ]
/**_x000D_
* De-duplicate an array keeping only unique values._x000D_
* Use hash table (js object) to filter-out duplicates._x000D_
* The order of array elements is maintained._x000D_
* This algorithm is particularly efficient for large arrays (linear time)._x000D_
*/_x000D_
function arrayUniqueFast(arr) {_x000D_
var seen = {};_x000D_
var result = [];_x000D_
var i, len = arr.length;_x000D_
for (i = 0; i < len; i++) {_x000D_
var item = arr[i];_x000D_
// hash table lookup_x000D_
if (!seen[item]) {_x000D_
result.push(item);_x000D_
seen[item] = true;_x000D_
}_x000D_
}_x000D_
return result;_x000D_
}_x000D_
_x000D_
///// test_x000D_
var array1 = ["Vijendra", "Singh"];_x000D_
var array2 = ["Singh", "Shakya"];_x000D_
_x000D_
var result = arrayUniqueFast(array1.concat(array2));_x000D_
document.write('<br>result: ' + result);For other methods to dedup an array, please see my benchmarks at: https://jsperf.com/de-duplicate-an-array-keeping-only-unique-values
The best solution...
You can check directly in the browser console by hitting...
Without duplicate
a = [1, 2, 3];
b = [3, 2, 1, "prince"];
a.concat(b.filter(function(el) {
return a.indexOf(el) === -1;
}));
With duplicate
["prince", "asish", 5].concat(["ravi", 4])
If you want without duplicate you can try a better solution from here - Shouting Code.
[1, 2, 3].concat([3, 2, 1, "prince"].filter(function(el) {
return [1, 2, 3].indexOf(el) === -1;
}));
Try on Chrome browser console
f12 > console
Output:
["prince", "asish", 5, "ravi", 4]
[1, 2, 3, "prince"]
Just steer clear of nested loops (O(n^2)), and .indexOf() (+O(n)).
function merge(a, b) {
var hash = {};
var i;
for (i = 0; i < a.length; i++) {
hash[a[i]] = true;
}
for (i = 0; i < b.length; i++) {
hash[b[i]] = true;
}
return Object.keys(hash);
}
var array1 = ["Vijendra", "Singh"];
var array2 = ["Singh", "Shakya"];
var array3 = merge(array1, array2);
console.log(array3);Source: Stackoverflow.com