基于ES6 JavaScript实现按名称去重并保留最大值的数组过滤

哦，这个需求太常见啦！咱用ES6的特性就能轻松搞定。我给你分享两种实用的实现方式，你可以按需选择：

方法一：使用Array.reduce()（高效简洁） #

这个方法只需要遍历一次数组，效率很高。核心思路是用一个临时对象来记录每个name对应的最大value，最后再把这个对象转换成目标数组：

const array = [
  { name: "SI", value: 3 },
  { name: "MI", value: 2 },
  { name: "SI", value: 7 },
  { name: "SI", value: 9 },
  { name: "MI", value: 3 }
];

const result = Object.values(
  array.reduce((acc, curr) => {
    // 如果当前name不在acc里，或者当前value比已存的大，就更新
    if (!acc[curr.name] || curr.value > acc[curr.name].value) {
      acc[curr.name] = curr;
    }
    return acc;
  }, {})
);

console.log(result);
// 输出：[ { name: "SI", value: 9 }, { name: "MI", value: 3 } ]

方法二：先取唯一name再筛选（直观易读） #

如果你觉得reduce有点绕，这种分步的方式更直观。先提取所有不重复的name，再对每个name筛选出对应的元素，找出最大的value：

const array = [
  { name: "SI", value: 3 },
  { name: "MI", value: 2 },
  { name: "SI", value: 7 },
  { name: "SI", value: 9 },
  { name: "MI", value: 3 }
];

// 获取所有唯一的name
const uniqueNames = [...new Set(array.map(item => item.name))];

// 对每个name处理，取最大value
const result = uniqueNames.map(name => {
  const maxItem = array
    .filter(item => item.name === name)
    .reduce((prev, curr) => curr.value > prev.value ? curr : prev);
  return maxItem;
});

console.log(result);
// 输出：[ { name: "SI", value: 9 }, { name: "MI", value: 3 } ]

两种方法都能得到你想要的结果～第一种性能更好（只遍历一次数组），第二种逻辑更直白，看你喜欢哪种啦！

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