📜  lodash uniqBy js 中的替代方案 - Javascript (1)

📅  最后修改于: 2023-12-03 15:32:45.016000             🧑  作者: Mango

lodash uniqBy js 中的替代方案 - Javascript

lodash中的uniqBy函数可以快速帮助我们从数组中移除重复项。但是,如果您不想在您的项目中使用lodash,那么您还有其他一些替代方案。在本文中,我们将介绍一些从lodash中uniqBy函数中得到的灵感的替代方案。

1. 使用Set对象

Javascript的Set对象实例创建一个类似于数组的对象,但其一些特性使其代替lodash的uniqBy函数非常方便。

const arr = [{id: 1, name: "John"}, {id: 2, name: "Jane"}, {id: 1, name: "John"}];

const uniqueArr = [...new Set(arr.map(item => item.id))].map(id => arr.find(item => item.id === id));

在这个例子中,我们首先通过map方法将数组中每个对象的id属性提取出来,并创建一个Set对象以删除包含重复id的元素。最后,我们再次使用map方法并使用find函数来返回原始数组中具有唯一id的对象。

2. 使用reduce函数

reduce函数是Javascript中的一个内置方法,但是如果不熟悉该函数,则可能会导致一些混淆。

const arr = [{id: 1, name: "John"}, {id: 2, name: "Jane"}, {id: 1, name: "John"}];

const uniqueArr = arr.reduce((accumulator, current) => {
    if (!accumulator.find(item => item.id === current.id)) {
        return accumulator.concat([current]);
    }
    return accumulator;
}, []);

该代码中的reduce函数将原始数组压缩为一个新的数组,其中每个对象都是唯一的。

3. 使用Object.keys

如果您的重复项是由对象实例引起的,则可以使用Object.keys来快速创建一个具有唯一键的新对象。

const arr = [{id: 1, name: "John"}, {id: 2, name: "Jane"}, {id: 1, name: "John"}];

const uniqueObj = arr.reduce((accumulator, current) => {
    accumulator[current.id] = current;
    return accumulator;
}, {});

const uniqueArr = Object.keys(uniqueObj).map(key => uniqueObj[key]);

在这个例子中,我们首先通过reduce函数创建一个具有唯一id的对象。最后,我们使用Object.keys来获取唯一对象的键值,然后使用map方法返回原始数组中对应的对象实例。

结论

在本文中,我们介绍了一些可以替代lodash中uniqBy函数的方案。无论您选择哪种方案,都可以快速轻松地从数组中移除重复项。