如何仅比较和过滤 es6 中两个对象数组中的不匹配数组

Question

在我的 Angular 应用程序中，我试图只获取从 UI 修改的更新数组。

在这里，我有两个数组，其中一个role_name被更改。我想比较和过滤掉修改后的对象，只返回那些修改后的数组。(在这种情况下，role_name值被修改(

我尝试在 ES6 的帮助下过滤掉，但它不起作用。

有人可以帮助我在哪里失踪吗？

var arr1 = [ {
"num" : null,
"role_name" : "ABC",
"profile" : "ff",
"user" : "1234",
"rn" : "1",
"user_name" : "Rywan"
},
{
"num" : null,
"role_name" : "DEF",
"profile" : "ff",
"user" : "1234",
"rn" : "2",
"user_name" : "adecg"
},
{
"num" : null,
"role_name" : "GHJ",
"profile" : "ff",
"user" : "1234",
"rn" : "3",
"user_name" : "dde"
},
{
"num" : null,
"role_name" : "RRT",
"profile" : "ff",
"user" : "1234",
"rn" : "4",
"user_name" : "kumar"
},
{
"num" : null,
"role_name" : "SFR",
"profile" : "ff",
"user" : "1234",
"rn" : "5",
"user_name" : "SASI"
}
];
var arr2 = [ {
"num" : null,
"role_name" : "ABC",
"profile" : "ff",
"user" : "1234",
"rn" : "1",
"user_name" : "Rywan"
},
{
"num" : null,
"role_name" : "ROLE_CHANGED",
"profile" : "ff",
"user" : "1234",
"rn" : "2",
"user_name" : "adecg"
},
{
"num" : null,
"role_name" : "GHJ",
"profile" : "ff",
"user" : "1234",
"rn" : "3",
"user_name" : "dde"
},
{
"num" : null,
"role_name" : "RRT",
"profile" : "ff",
"user" : "1234",
"rn" : "4",
"user_name" : "kumar"
},
{
"num" : null,
"role_name" : "SFR",
"profile" : "ff",
"user" : "1234",
"rn" : "5",
"user_name" : "SASI"
}
];
let filteredData;
filteredData = arr1.filter(function(o1){
//filter out (!) items in arr2
return arr2.some(function(o2){
return o1.role_name !== o2.role_name;  
});
});

console.log(filteredData);

输出应为

[
{
"num" : null,
"role_name" : "ROLE_CHANGED",
"profile" : "ff",
"user" : "1234",
"rn" : "2",
"user_name" : "adecg"
}
]

Answer 1

你的逻辑有点缺陷，因为你的.some()总是会返回 true，因为总有一个元素会有所不同。您想要做的是实际检查任何一个角色名称是否相同。当找不到匹配项时(即.some()返回 false(，那么您就知道role_name已被更改：

const filteredData = arr2.filter((o1, i) => {
return !arr1.some((o2) => {
return o1.role_name === o2.role_name;
});
});

var arr1 = [{
"num": null,
"role_name": "ABC",
"profile": "ff",
"user": "1234",
"rn": "1",
"user_name": "Rywan"
},
{
"num": null,
"role_name": "DEF",
"profile": "ff",
"user": "1234",
"rn": "2",
"user_name": "adecg"
},
{
"num": null,
"role_name": "GHJ",
"profile": "ff",
"user": "1234",
"rn": "3",
"user_name": "dde"
},
{
"num": null,
"role_name": "RRT",
"profile": "ff",
"user": "1234",
"rn": "4",
"user_name": "kumar"
},
{
"num": null,
"role_name": "SFR",
"profile": "ff",
"user": "1234",
"rn": "5",
"user_name": "SASI"
}
];
var arr2 = [{
"num": null,
"role_name": "ABC",
"profile": "ff",
"user": "1234",
"rn": "1",
"user_name": "Rywan"
},
{
"num": null,
"role_name": "ROLE_CHANGED",
"profile": "ff",
"user": "1234",
"rn": "2",
"user_name": "adecg"
},
{
"num": null,
"role_name": "GHJ",
"profile": "ff",
"user": "1234",
"rn": "3",
"user_name": "dde"
},
{
"num": null,
"role_name": "RRT",
"profile": "ff",
"user": "1234",
"rn": "4",
"user_name": "kumar"
},
{
"num": null,
"role_name": "SFR",
"profile": "ff",
"user": "1234",
"rn": "5",
"user_name": "SASI"
}
];
const filteredData = arr2.filter((o1, i) => {
return !arr1.some((o2) => {
return o1.role_name === o2.role_name;
});
});
console.log(filteredData);

Answer 2

我们已经拥有的解决方案有点不同。

在使用filter()Object.keys()时，如果值像arr1[index].role_name !== arr2[index].role_name一样发生了变化，我们还可以根据数组的索引比较role_name属性。这将返回我们更改了值的数组的所有索引。然后使用map()根据找到的数组键为这些元素生成一个新数组。

所以解决方案是：

Object.keys(arr1).filter(index => arr1[index].role_name !== arr2[index].role_name)
.map(index => arr2[index]);

Object.keys()：

Object.keys(( 方法返回给定对象自己的可枚举属性名称的数组，其顺序与普通循环的顺序相同。

Array.prototype.filter()：

filter(( 方法创建一个新数组，其中包含通过所提供函数实现的测试的所有元素。

Array.prototype.map()：

map(( 方法创建一个新数组，其中填充了对调用数组中的每个元素调用提供的函数的结果。

我认为您可以尝试以下方法：

const arr1 = [{
"num" : null,
"role_name" : "ABC",
"profile" : "ff",
"user" : "1234",
"rn" : "1",
"user_name" : "Rywan"
},
{
"num" : null,
"role_name" : "DEF",
"profile" : "ff",
"user" : "1234",
"rn" : "2",
"user_name" : "adecg"
},
{
"num" : null,
"role_name" : "GHJ",
"profile" : "ff",
"user" : "1234",
"rn" : "3",
"user_name" : "dde"
},
{
"num" : null,
"role_name" : "RRT",
"profile" : "ff",
"user" : "1234",
"rn" : "4",
"user_name" : "kumar"
},
{
"num" : null,
"role_name" : "SFR",
"profile" : "ff",
"user" : "1234",
"rn" : "5",
"user_name" : "SASI"
}];
const arr2 = [{
"num" : null,
"role_name" : "ABC",
"profile" : "ff",
"user" : "1234",
"rn" : "1",
"user_name" : "Rywan"
},
{
"num" : null,
"role_name" : "ROLE_CHANGED",
"profile" : "ff",
"user" : "1234",
"rn" : "2",
"user_name" : "adecg"
},
{
"num" : null,
"role_name" : "GHJ",
"profile" : "ff",
"user" : "1234",
"rn" : "3",
"user_name" : "dde"
},
{
"num" : null,
"role_name" : "RRT",
"profile" : "ff",
"user" : "1234",
"rn" : "4",
"user_name" : "kumar"
},
{
"num" : null,
"role_name" : "SFR",
"profile" : "ff",
"user" : "1234",
"rn" : "5",
"user_name" : "SASI"
}];
const changedObjects = Object.keys(arr1).filter(index => arr1[index].role_name !== arr2[index].role_name)
.map(index => arr2[index]);

console.log(changedObjects);

我希望这有所帮助！