实现数组合并:用替换数组覆盖原数组并自动剔除不存在项

该教程详解如何通过简洁可靠的 javascript 方式,将原数组“按需更新”为替换数组——仅保留替换数组中的元素(自动剔除原数组中多余项),同时不引入重复值,且无需额外去重逻辑。

根据需求分析,所谓“合并”实为一种有向同步操作:以 replacingArray 为唯一权威数据源,完全取代 originalArray 的内容结构,同时天然满足所有约束条件:

  • 非存在值被剔除:因结果直接取自 replacingArray,原数组中独有元素(如示例中的 2)自然不会出现;
  • 新值被添加:replacingArray 中新增元素(如 5、4)直接纳入结果;
  • 无重复添加:只要 replacingArray 本身无重复(这是输入前提),展开后结果即无重复;
  • 长度无关:无论两数组长度是否一致,均以 replacingArray 为准。

因此,最简、最高效、最语义清晰的实现就是直接赋值或原地替换,无需遍历、查找、过滤或使用 Set 等中间结构。

✅ 推荐实现方式

方案一:返回新数组(推荐 —— 函数式、不可变、安全)

const merge = (original, replacing) => [...replacing];

// 使用示例
const originalArray = [1, 2, 3];
const replacingArray = [1, 5, 3, 4];
const result = merge(originalArray, replacingArray);
console.log(result); // [1, 5, 3, 4]
✅ 优点:纯函数、无副作用、内存开销可控(浅拷贝)、可链式调用; ⚠️ 注意:若 replacing 是类数组对象(如 arguments 或 NodeList),需先转为真数组:Array.from(replacing)。

方案二:原地修改原数组(适用于需复用原引用的场景)

const mergeInPlace = (original, replacing) => {
  original.splice(0, original.length, ...replacing);
  return original; // 支持链式调用
};

// 使用示例
const arr = [1, 2, 3];
mergeInPlace(arr, [1, 5, 3, 4]);
console.log(arr); // [1, 5, 3, 4]

✅ 优点:零内存分配(不创建新数组)、适合性能敏感或大数据量场景;
⚠️ 注意:会改变原数组引用,需确保调用方知晓此副作用。

❌ 不推荐的复杂方案(避免踩坑)

以下写法看似“严谨”,实则画蛇添足,且可能引入 Bug:

// ❌ 错误:假设需保留原顺序 + 手动 diff → 违背题意且逻辑冗余
original.filter(x => replacing.includes(x)).concat(replacing.filter(x => !original.includes(x)));

// ❌ 风险:若 replacing 含重复值,结果也会重复(违反“无重复添加”要求)
[...new Set([...original, ...replacing])]; // 这是并集,不是题目要求的“以 replacing 为准”

总结

  • 核心洞察:题目描述的四条规则共同指向一个本质行为——用 replacingArray 完全替代 originalArray
  • 最佳实践:优先采用 merge = (a, b) => [...b],语义明确、性能最优、符合现代 JS 开发范式;
  • 关键提醒:确保 replacingArray 输入已满足业务要求(如去重、排序等),因为 merge 本身不负责数据清洗——它只做精准传递。