高效处理数组差异: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


相关推荐
狗凯之家源码网14 小时前
短剧系统搭建实战:源码功能与商业变现效果全景展示
开发语言·php
用户21816970493015 小时前
Flutter(四)Dart语法 空安全 运算符 流程控制
前端
许彰午15 小时前
政务督办的分合模式:主办协办的并发审批
前端·javascript·政务
用户693717500138415 小时前
AI时代,程序员该往哪走?
前端·后端
ttwuai16 小时前
GoFrame 后台日志清空失败:无 WHERE 删除为什么被拦住
前端·golang
易筋紫容16 小时前
创建型模式:对象的诞生艺术
开发语言·前端·javascript
888CC++16 小时前
C++ 快速学习指南:从入门到进阶的实战路线
开发语言·c++
小小晓.16 小时前
C++记:函数
开发语言·c++·算法
半句唐诗16 小时前
我是如何通过 Access Token 成功发布第一个 npm 包的
前端·npm·node.js
程序员黑豆16 小时前
鸿蒙应用开发:@Provider 与 @Consumer 跨组件双向同步详解
前端·harmonyos