如何修复JavaScript中两个字符串数组变更追踪功能的代码错误

问题原因 #

现有代码存在两处逻辑错误：

• 仅遍历了变更数组changedArr的长度，当初始数组initialArr长度更长时，超出部分的元素不会被检测是否被移除
• 移除元素的判断逻辑和变更数组的下标绑定，没有覆盖所有初始数组元素

修复方案 #

直接按照「新增=变更数组有但初始数组没有的元素，移除=初始数组有但变更数组没有的元素」的逻辑重写即可，代码如下：

const initial = ['test', 'color'];
const changed = ['5'];

const checkArrDiff = (initialArr, changedArr) => {
  // 若数组长度较大，可转Set提升查找性能：
  // const initialSet = new Set(initialArr);
  // const changedSet = new Set(changedArr);
  // 下方的includes替换为对应Set的has方法即可
  const newElements = changedArr.filter(item => !initialArr.includes(item));
  const removedElements = initialArr.filter(item => !changedArr.includes(item));
  return {
    new: newElements,
    removed: removedElements
  }
}

console.log(checkArrDiff(initial, changed))

运行后输出和你预期的结果完全一致：

{ new: [ '5' ], removed: [ 'test', 'color' ] }

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