我有一个包含对象数组的对象。
obj = {};
obj.arr = new Array();
obj.arr.push({place:"here",name:"stuff"});
obj.arr.push({place:"there",name:"morestuff"});
obj.arr.push({place:"there",name:"morestuff"});
我想知道从数组中删除重复对象的最佳方法是什么。例如,obj.arr将变成。。。
{place:"here",name:"stuff"},
{place:"there",name:"morestuff"}
这种方式对我很有效:
function arrayUnique(arr, uniqueKey) {
const flagList = new Set()
return arr.filter(function(item) {
if (!flagList.has(item[uniqueKey])) {
flagList.add(item[uniqueKey])
return true
}
})
}
const data = [
{
name: 'Kyle',
occupation: 'Fashion Designer'
},
{
name: 'Kyle',
occupation: 'Fashion Designer'
},
{
name: 'Emily',
occupation: 'Web Designer'
},
{
name: 'Melissa',
occupation: 'Fashion Designer'
},
{
name: 'Tom',
occupation: 'Web Developer'
},
{
name: 'Tom',
occupation: 'Web Developer'
}
]
console.table(arrayUnique(data, 'name'))// work well
打印输出
┌─────────┬───────────┬────────────────────┐
│ (index) │ name │ occupation │
├─────────┼───────────┼────────────────────┤
│ 0 │ 'Kyle' │ 'Fashion Designer' │
│ 1 │ 'Emily' │ 'Web Designer' │
│ 2 │ 'Melissa' │ 'Fashion Designer' │
│ 3 │ 'Tom' │ 'Web Developer' │
└─────────┴───────────┴────────────────────┘
ES5:
function arrayUnique(arr, uniqueKey) {
const flagList = []
return arr.filter(function(item) {
if (flagList.indexOf(item[uniqueKey]) === -1) {
flagList.push(item[uniqueKey])
return true
}
})
}
这两种方式更简单易懂。
在一行中使用ES6+,您可以按键获得唯一的对象列表:
const key = 'place';
const unique = [...new Map(arr.map(item => [item[key], item])).values()]
可以将其放入函数中:
function getUniqueListBy(arr, key) {
return [...new Map(arr.map(item => [item[key], item])).values()]
}
下面是一个工作示例:
常量arr=[{地点:“这里”,名称:“x”,其他:“其他stuff1”},{地点:“那里”,名称:“x”,其他:“其他stuff2”},{地点:“这里”,名称:“y”,其他:“其他stuff4”},{地点:“这里”,名称:“z”,其他:“其他stuff5”}]函数getUniqueListBy(arr,key){return[…new Map(arr.Map(item=>[item[key],item])).values()]}const arr1=getUniqueListBy(arr,'place')console.log(“按位置唯一”)console.log(JSON.stringify(arr1))console.log(“\n名称唯一”)const arr2=getUniqueListBy(arr,'name')console.log(JSON.stringify(arr2))
它是如何工作的
首先,以可以用作Map输入的方式重新映射数组。
arr.map(项=>[项[键],项]);
这意味着阵列的每个项目将被转换为具有2个元素的另一个阵列;选定的键作为第一个元素,整个初始项作为第二个元素,这称为条目(例如数组条目、映射条目)。这是一个官方文档,其中有一个示例显示了如何在Map构造函数中添加数组项。
放置钥匙时的示例:
[["here", {place: "here", name: "x", other: "other stuff1" }], ...]
其次,我们将这个修改后的数组传递给Map构造函数,这就是神奇的发生。映射将消除重复的关键字值,只保留同一关键字的最后插入值。注意:贴图保持插入顺序。(检查贴图和对象之间的差异)
新映射(上面刚刚映射的条目数组)
第三,我们使用map值来检索原始项,但这次没有重复项。
新映射(mappedArr).values()
最后一个是将这些值添加到一个新的数组中,这样它可以看起来像初始结构,并返回:
return[…new Map(mappedArr).values()]
function genFilterData(arr, key, key1) {
let data = [];
data = [...new Map(arr.map((x) => [x[key] || x[key1], x])).values()];
const makeData = [];
for (let i = 0; i < data.length; i += 1) {
makeData.push({ [key]: data[i][key], [key1]: data[i][key1] });
}
return makeData;
}
const arr = [
{make: "here1", makeText:'hj',k:9,l:99},
{make: "here", makeText:'hj',k:9,l:9},
{make: "here", makeText:'hj',k:9,l:9}]
const finalData= genFilterData(data, 'Make', 'MakeText');
console.log(finalData);
常量=[{地点:“这里”,名称:“东西”},{地点:“there”,名称:“morestuff”},{地点:“there”,名称:“morestuff”}];constfilteredArr=things.reduce((thing,current)=>{const x=thing.find(item=>item.place==current.place);如果(!x){return thing.concat([current]);}其他{归还物品;}}, []);console.log(filteredArr)
通过设置对象解决方案|根据数据类型
const seed=new Set();常量=[{地点:“这里”,名称:“东西”},{地点:“there”,名称:“morestuff”},{地点:“there”,名称:“morestuff”}];constfilteredArr=things.filter(el=>{const duplicate=已看到。有(el.place);见添加(el.place);回来复制});console.log(filteredArr)
设置对象特征
Set Object中的每个值都必须是唯一的,将检查值是否相等
根据数据类型(无论是原始值还是对象引用)设置对象存储唯一值的目的。它有四个非常有用的实例方法add、clear、has和delete。
唯一的数据类型功能(&D):。。
加法
默认情况下,它将唯一数据推送到集合中,并保留数据类型。。这意味着它可以防止将重复项推入集合,并且默认情况下还会检查数据类型。。。
has方法
有时需要检查数据项是否存在于集合和中。这是集合检查唯一id或项和数据类型的简便方法。。
删除方法
它将通过标识数据类型从集合中删除特定项。。
清除方法
它将从一个特定变量中删除所有集合项,并将其设置为空对象
Set对象还具有迭代方法和更多功能。。
更好地从这里阅读:Set-JavaScript | MDN