如何遍历两个数组获取arr1中独有的元素？

现有两个数组：

arr1 = [ 'Account2', 'Account4', 'Account4', 'Account5' ]
arr2 = [ 'Account2', 'Account4', 'Account7' ]

需要生成一个新数组arr3，只包含arr1中存在但arr2中没有的元素，预期结果为arr3 = ['Account5']。

我尝试了以下代码，但未得到正确结果：

for (var i = 0; i < arr1.length; i++) {
    for (var j = 0; j < arr2.length; j++) {
      if (arr1[i] != arr2[j]) {
        arr3.push(arr1[i]);
      }
    } 
  }
  console.log("arr3", arr3);

问题分析 #

你的代码逻辑错误：只要arr1的元素和arr2里某一个元素不相等，就将其推入arr3。比如Account2会和arr2中的Account4、Account7不相等，因此会被推入两次；每个Account4都会和arr2中的Account2、Account7不相等，各自被推入两次，最终arr3会变成['Account2','Account2','Account4','Account4','Account4','Account4','Account5','Account5','Account5']，完全不符合预期。

正确解法 #

解法1：修正双重循环逻辑 #

要判断元素是否完全不在arr2中，应先假设元素不存在于arr2，遍历arr2找到相等元素后标记为存在，最终仅将未标记的元素推入arr3：

var arr1 = [ 'Account2', 'Account4', 'Account4', 'Account5' ];
var arr2 = [ 'Account2', 'Account4', 'Account7' ];
var arr3 = [];

for (var i = 0; i < arr1.length; i++) {
  var existsInArr2 = false;
  for (var j = 0; j < arr2.length; j++) {
    if (arr1[i] === arr2[j]) {
      existsInArr2 = true;
      break; // 找到匹配项后立即终止内层循环，提升效率
    }
  }
  if (!existsInArr2) {
    arr3.push(arr1[i]);
  }
}

console.log("arr3", arr3); // 输出: arr3 ['Account5']

解法2：用数组API简化代码 #

利用filter和includes组合，代码更简洁直观：

var arr1 = [ 'Account2', 'Account4', 'Account4', 'Account5' ];
var arr2 = [ 'Account2', 'Account4', 'Account7' ];
var arr3 = arr1.filter(item => !arr2.includes(item));

console.log("arr3", arr3); // 输出: arr3 ['Account5']

filter会遍历arr1的每个元素，仅保留满足!arr2.includes(item)的元素——也就是arr2中不存在的元素。

解法3：可选去重处理 #

如果arr1中存在重复的独有元素，希望arr3仅保留唯一值，可结合Set实现：

var arr1 = [ 'Account2', 'Account4', 'Account4', 'Account5', 'Account5' ];
var arr2 = [ 'Account2', 'Account4', 'Account7' ];
var arr3 = [...new Set(arr1.filter(item => !arr2.includes(item)))];

console.log("arr3", arr3); // 输出: arr3 ['Account5']

内容的提问来源于stack exchange，提问作者Shaik Naveed