如何移除对象数组中的重复键？保留最后添加的重复项

问题描述 #

需要删除对象数组中atributos内重复键对应的元素，保留最后添加的那组数据。例如原数据中Tallas出现两次，最终只保留最后一组Tallas数据。

原数据 #

const data = 
  [ { atributos: { Tallas:  [{ id: 0, name: 'XS' }, { id: 1, name: 'S'   }] }} 
  , { atributos: { Calzado: [{ id: 0, name: '10' }, { id: 1, name: '9.5' }] }} 
  , { atributos: { Tallas:  [{ id: 0, name: 'XS' }] }} 
  ] 

预期结果 #

const expected = 
   [{ atributos: { Calzado: [{ id: 0, name: '10' }, { id: 1, name: '9.5' }] }} 
  , { atributos: { Tallas:  [{ id: 0, name: 'XS' }] }} 
  ] 

你的代码问题分析 #

你尝试的filter+findIndex方案未生效，原因有两点：

1. 拼写错误：原数据属性是atributos，但你写的是attributes
2. 对象引用比较：t.attributes === arr.attributes是直接比较对象内存地址，而非内容。即使两个对象结构完全一致，只要是不同实例就会判定为不等，导致findIndex无法匹配到正确的重复项。

解决方案 #

方法1：使用reduce高效去重（推荐）

利用对象键的唯一性，遍历数组时让后续项覆盖前面的同名键，最终保留最后出现的项，时间复杂度O(n)：

const result = Object.values(data.reduce((acc, item) => {
  // 提取当前item的atributos中的唯一键
  const attrKey = Object.keys(item.atributos)[0];
  // 用属性键作为对象索引，后续项会覆盖之前的同名项
  acc[attrKey] = item;
  return acc;
}, {}));

console.log(result); // 与expected结果一致

方法2：filter结合反向查找最后索引

通过反向遍历找到属性键最后一次出现的位置，只保留该位置的项：

const result = data.filter((item, index) => {
  const attrKey = Object.keys(item.atributos)[0];
  // 反向查找当前键最后一次出现的索引
  const reverseLastIndex = [...data].reverse().findIndex(i => Object.keys(i.atributos)[0] === attrKey);
  // 转换为原数组的索引
  const originalLastIndex = data.length - 1 - reverseLastIndex;
  // 仅保留最后出现的项
  return index === originalLastIndex;
});

console.log(result); // 与expected结果一致

说明 #

两种方法均假设每个atributos对象内只有一个属性键（如Tallas或Calzado），如果存在多个键的场景，需要调整键的提取逻辑。

内容的提问来源于stack exchange，提问作者Táctical Store Perú