优化plantList分类去重函数 解决Set一行式代码React编译问题

一行式代码报错原因 #

你编写的Set去重代码存在逻辑错误，而非React环境编译问题：你直接将包含植物对象的plantList传入Set，Set对引用类型（对象）的去重是基于内存地址判断，所有植物对象都是独立引用不会被判定为重复，且你需要的是category字段的去重结果而非整个对象去重，因此逻辑不成立。

修复后的正确一行式去重代码

const categories = Array.from(new Set(plantList.map(plant => plant.category)))

先通过map提取所有植物的category字段值，再通过Set去重，最后转回数组即可正常运行，性能远高于你当前使用的reduce方案。

现有reduce方案的优化说明 #

你当前使用的reduce方案逻辑可以正常运行，但时间复杂度为O(n²)：每一轮循环都会执行acc.includes()，该方法需要遍历整个累加数组做匹配，当数组量级较大时性能损耗明显。
如果因场景限制不能使用Set方案，也可以用对象键唯一性的特性实现O(n)复杂度的去重，代码如下：

const categories = Object.keys(plantList.reduce((acc, plant) => {
  acc[plant.category] = true
  return acc
}, {}))

内容的提问来源于stack exchange，提问作者Victor Lepers