求助：使用Lodash在Reducer中实现无重复的条件式数组拼接

嘿，我看出来问题出在哪啦～你现在的代码里只是直接把原数组和待拼接对象做了concat，完全没调用Lodash的_.uniqBy方法，所以重复的对象自然会保留下来。下面给你两种可行的解决方案：

方法一：用_.uniqBy直接去重拼接 #

这是你原本想实现的思路，只需要把concat后的结果传入_.uniqBy，指定id作为判断唯一性的字段即可：

const arr1 = [{id:1, name:'alex'}, {id:2, name:'taylor'}]
const val1 = {id:1, name:'alex'};
// 先拼接数组，再根据id去重
const finalArr = _.uniqBy(arr1.concat(val1), 'id');
const reducer = { finalArr };
console.log('Reducer', reducer);

执行后会得到你期望的输出：

Reducer { finalArr: [ { id: 1, name: 'alex' }, { id: 2, name: 'taylor' } ] }

方法二：先检查再拼接（更高效） #

如果数组规模较大，先判断对象是否存在再决定是否拼接，能避免不必要的数组遍历和去重操作：

const arr1 = [{id:1, name:'alex'}, {id:2, name:'taylor'}]
const val1 = {id:1, name:'alex'};

// 用_.some检查数组中是否已存在相同id的对象
const isExists = _.some(arr1, item => item.id === val1.id);
// 不存在则拼接，否则直接复用原数组
const finalArr = isExists ? arr1 : [...arr1, val1]; // 也可以用arr1.concat(val1)

const reducer = { finalArr };
console.log('Reducer', reducer);

注意事项 #

在Reducer中一定要遵循纯函数的原则：不要修改原数组，而是返回新的数组。concat或者扩展运算符[...arr1, val1]都是创建新数组的安全方式，别用push这类会修改原数组的方法哦～

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