JavaScript合并两个数组并去重获取独有值的实现方案

首先说明：你描述的「拼接两个数组后移除全部重复项」得到的结果会包含两个数组所有不重复的5个元素，和你给出的期望输出["red", "green"]不符，结合期望结果判断，你实际需要的是两个数组的差集（仅保留存在于array2中、不存在于array1中的元素）。以下分别给出两种需求的ES5、ES6实现：

需求1：获取两个数组的差集（匹配你给出的期望输出） #

ES6 实现 #

利用Set数据结构提高查找效率，代码更简洁：

let array1 = ["apple", "banana", "mango"];
let array2 = ["apple", "banana", "mango", "red", "green"];

const set1 = new Set(array1);
const array3 = array2.filter(item => !set1.has(item));

console.log(array3); // 输出：["red", "green"]

ES5 实现 #

用indexOf判断元素是否存在于array1中：

let array1 = ["apple", "banana", "mango"];
let array2 = ["apple", "banana", "mango", "red", "green"];

var array3 = array2.filter(function(item) {
  return array1.indexOf(item) === -1;
});

console.log(array3); // 输出：["red", "green"]

需求2：拼接两个数组后完全去重 #

如果你确实需要保留两个数组所有不重复元素，可使用以下方案：

ES6 实现 #

let array1 = ["apple", "banana", "mango"];
let array2 = ["apple", "banana", "mango", "red", "green"];

const array3 = [...new Set([...array1, ...array2])];
// 输出：["apple", "banana", "mango", "red", "green"]

ES5 实现 #

按照你提到的「filter过滤首次出现元素」逻辑实现：

let array1 = ["apple", "banana", "mango"];
let array2 = ["apple", "banana", "mango", "red", "green"];

var combined = array1.concat(array2);
var array3 = combined.filter(function(item, index) {
  return combined.indexOf(item) === index;
});
// 输出：["apple", "banana", "mango", "red", "green"]

内容的提问来源于stack exchange，提问作者Dhaval Bhatt