我有两个JavaScript数组:

var array1 = ["Vijendra","Singh"];
var array2 = ["Singh", "Shakya"];

我希望输出为:

var array3 = ["Vijendra","Singh","Shakya"];

输出数组应删除重复的单词。

如何在JavaScript中合并两个数组,以便从每个数组中只获得唯一的项目,其顺序与它们插入原始数组的顺序相同?


当前回答

在当今时代,使用现有的图书馆提供更简单、更优雅的内容:

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

// our inputs:
const array1 = ['Vijendra', 'Singh'];
const array2 = ['Singh', 'Shakya'];

const i = pipe(
    array1,
    concat(array2), // adding array
    distinct() // making it unique
);

console.log([...i]); //=> ['Vijendra', 'Singh', 'Shakya']

这两者都是高性能的,因为我们只迭代一次,而且代码非常容易阅读。

注:我是iter ops的作者。

其他回答

我学会了一种用扩展运算符连接两个数组的小方法:

var array1 = ['tom', 'dick', 'harry'];
var array2 = ['martin', 'ricky'];

array1.push(...array2);

“…”扩展运算符将以下数组拆分为单个项,然后push可以将它们作为单独的参数处理。

如果您合并对象数组,请考虑使用lodash UnionBy函数,它允许您设置自定义谓词比较对象:

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);

结果是:〔{a:1;b:2},{a:2;b:4}〕

结果中使用了来自数组的第一个传递匹配

var a = [1,2,3]
var b = [1,2,4,5]

我喜欢一行。这将把不同的b元素推到

b.forEach(item => a.includes(item) ? null : a.push(item));

另一个版本不会修改

var c = a.slice();
b.forEach(item => c.includes(item) ? null : c.push(item));

我有一个类似的请求,但它具有数组中元素的Id。

这里是我进行重复数据消除的方法。

它简单,易于维护,使用方便。

// Vijendra's Id = Id_0
// Singh's Id = Id_1
// Shakya's Id = Id_2

let item0 = { 'Id': 'Id_0', 'value': 'Vijendra' };
let item1 = { 'Id': 'Id_1', 'value': 'Singh' };
let item2 = { 'Id': 'Id_2', 'value': 'Shakya' };

let array = [];

array = [ item0, item1, item1, item2 ];

let obj = {};
array.forEach(item => {
    obj[item.Id] = item;
});

let deduplicatedArray = [];
let deduplicatedArrayOnlyValues = [];
for(let [index, item] of Object.values(obj).entries()){
    deduplicatedArray = [ ...deduplicatedArray, item ];
    deduplicatedArrayOnlyValues = [ ...deduplicatedArrayOnlyValues , item.value ];
};
    
console.log( JSON.stringify(array) );
console.log( JSON.stringify(deduplicatedArray) );
console.log( JSON.stringify(deduplicatedArrayOnlyValues ) );

控制台日志

[{"recordId":"Id_0","value":"Vijendra"},{"recordId":"Id_1","value":"Singh"},{"recordId":"Id_1","value":"Singh"},{"recordId":"Id_2","value":"Shakya"}]

[{"recordId":"Id_0","value":"Vijendra"},{"recordId":"Id_1","value":"Singh"},{"recordId":"Id_2","value":"Shakya"}]

["Vijendra","Singh","Shakya"]

ES2019年

可以像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())];
}

这是ES2019,因为flat()函数,但您可以使用core js将其作为polyfill获取。这里的T是TypeScript泛型类型,如果不使用TypeScript,则可以删除它。如果您使用的是TypeScript,请确保在tsconfig.json中的编译器选项中添加“lib”:[“es2019.array”]。

只需使用lodash。union