JS对比两个对象数组删除匹配项时仅能移除首个匹配元素问题

• 函数提前中断：第一次找到匹配的section时就直接执行return，函数执行立刻终止，后续的数组遍历、匹配删除逻辑完全不会运行，因此只能处理第一个匹配项。
• splice用法逻辑错误：Array.splice()的返回值是被删除元素组成的新数组，并非删除操作完成后剩余的原数组；代码中将splice的返回值重新赋值给filterSelection，相当于把原数组直接替换成了仅包含被删除项的集合，完全偏离了“返回剩余有效数组”的预期。
• 边遍历边修改数组的索引错位隐患：即便去掉return语句，正向遍历数组时，删除i位置的元素后，后续元素会整体向前移动一位，此时循环继续对i做自增操作，会直接跳过紧邻的下一个元素，造成漏删。

最简洁稳定的写法是利用数组的过滤能力，避免手动循环删除带来的索引问题，核心逻辑是先提取所有需要匹配的section值，再遍历原数组保留不需要删除的项：

const newFilterList = (filterSelection) => {
  // 提取customFilter中所有需要匹配的section值，用Set存储可以把查找效率降到O(1)
  const matchedSectionSet = new Set(customFilter.map(item => item.section));
  // 仅保留section不在匹配集合内的项
  return filterSelection.filter(item => !matchedSectionSet.has(item.section));
}

用给出的示例数据测试，最终返回的数组会仅保留section为Albums的项，完全符合“移除所有和customFilter元素section匹配的项”的需求。

如果需要手动写循环实现删除逻辑，可以采用倒序遍历的方式规避索引错位问题（倒序遍历时，已经处理过的索引位置不受前面删除操作的影响），参考写法如下：

const newFilterList = (filterSelection) => {
  // 从数组最后一项开始往前遍历，避免删除元素导致的索引偏移
  for(let i = filterSelection.length - 1; i >= 0; i--) {
    const currentSection = filterSelection[i].section;
    // 判断当前项的section是否和customFilter中的任意项匹配
    const isMatched = customFilter.some(cfItem => cfItem.section === currentSection);
    if(isMatched) {
      filterSelection.splice(i, 1);
    }
  }
  return filterSelection;
}

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