高效处理数组差异:JS中新增、删除、交集的最优解(Set实现)

👉 求:新数组 - 旧数组(差集)

也就是:

👉 新数组里有,但旧数组里没有的值


一、最简单直接(推荐)✅

js 复制代码
const oldArr = ['a', 'b', 'c']
const newArr = ['b', 'c', 'd', 'e']

const added = newArr.filter(item => !oldArr.includes(item))

console.log(added) // ['d', 'e']

✔ 语义清晰

✔ 适合数据量不大(<1万)


二、性能更优(推荐大数据)🔥

👉 用 Set,避免 includes 的 O(n)

js 复制代码
const oldArr = ['a', 'b', 'c']
const newArr = ['b', 'c', 'd', 'e']

const oldSet = new Set(oldArr)

const added = newArr.filter(item => !oldSet.has(item))

console.log(added) // ['d', 'e']

✔ 时间复杂度:O(n)

✔ 实际项目推荐用这个


三、如果你还想知道"删除了哪些"👇

👉 顺手一起算(很常见)

js 复制代码
const oldArr = ['a', 'b', 'c']
const newArr = ['b', 'c', 'd', 'e']

const oldSet = new Set(oldArr)
const newSet = new Set(newArr)

// 新增
const added = newArr.filter(item => !oldSet.has(item))

// 删除
const removed = oldArr.filter(item => !newSet.has(item))

console.log('新增:', added)   // ['d','e']
console.log('删除:', removed) // ['a']

四、封装一个通用方法(生产可用)🔥

js 复制代码
function diffArray(oldArr, newArr) {
  const oldSet = new Set(oldArr)
  const newSet = new Set(newArr)

  return {
    added: newArr.filter(item => !oldSet.has(item)),
    removed: oldArr.filter(item => !newSet.has(item)),
    common: newArr.filter(item => oldSet.has(item))
  }
}

用法:

js 复制代码
const res = diffArray(
  ['a','b','c'],
  ['b','c','d','e']
)

console.log(res)
/*
{
  added: ['d','e'],
  removed: ['a'],
  common: ['b','c']
}
*/

五、你这个场景的本质总结

👉 你其实在做的是:

  • 新增 = new - old
  • 删除 = old - new
  • 交集 = old ∩ new

六、一句话记住

👉 判断"有没有" → 用 Set

👉 判断"差异" → 用 filter + has


相关推荐
weixin_493503676 小时前
Vue3 前端生成 PDF:会员证书与活动签到表的三种打印方案与踩坑记录
前端·pdf·状态模式
傻啦嘿哟6 小时前
某招聘平台爬虫:爬取招聘岗位数据,分析各城市薪资水平
开发语言·爬虫·python
2501_933670796 小时前
2026秋招量化分析岗技能栈:Python、SQL、统计建模、回测项目怎么准备
开发语言·python·sql
李少兄7 小时前
JavaScript 数据类型完全指南
开发语言·javascript·ecmascript
Seoyoneh8 小时前
Agentic Workflow编排架构:云客服从“被动响应”迈向“主动执行”的技术实现
java·开发语言·架构
Tangyuewei8 小时前
Java 写 Agent:模型只是组件
java·开发语言
小玮看世界9 小时前
[Python]从合并区间到传感器融合区:合并区间在传感器区域融合的实际落地
开发语言·python
尾善爱看海9 小时前
前端算法与手写题集
前端·算法
徐小夕9 小时前
JitWord 4.0 万字分享:从协同工具到AI Word操作系统,聊聊3年产品创业史
前端·vue.js·后端
繁星蓝雨10 小时前
C++的设计与演进大纲(如何从C语言一步步成长为C++)
c语言·开发语言·c++·c++历史·c++演进