js获取两个数组对象的差集实现方法
作者：我的一个道姑朋友
这篇文章主要为大家介绍了js获取两个数组对象的差集实现方法,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
获取两个数组对象中都没不包含的元素
获得两个数组对象的差集，就是获取两个数组对象中都没不包含的元素:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>获得两个数组对象的差集</title>
<!--引入 element-ui 的样式，-->
<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css" rel="external nofollow" >
<script src="https://cdn.bootcss.com/vue/2.5.16/vue.min.js"></script>
<!-- 引入element 的组件库-->
<script src="https://unpkg.com/element-ui/lib/index.js"></script>
<style>
* {
margin: 0;
padding: 0;
}
#app {
margin: 50px;
}
.item {
margin-bottom: 20px;
}
</style>
</head>
<body>
<div id="app">
<div class="item">
原数组：
<div v-for="(item, index) in selectedText" :key="index">{{item}}</div>
</div>
<div class="item">
和原数组对比的数组：
<div v-for="(item, index) in brightTextArr" :key="index">{{item}}</div>
</div>
<div class="item">
差集：
<div v-for="(item, index) in differenceSet" :key="index">{{item}}</div>
</div>
</div>
<script>
new Vue({
el: '#app',
data() {
return {
// 原数组
selectedText: [
{
"parentId": "1665538708874002433",
"childId": [
"0",
"1",
"2",
"3",
"4",
"5",
"6",
"7"
]
},
{
"parentId": "1665538708861419522",
"childId": [
"0",
"1",
"2",
"3",
"4",
"5"
]
}
],
// 要对比的数组
brightTextArr: [
{
"parentId": "1665538708861419522",
"childId": [
"3",
"4",
"5",
'9'
]
},
{
"parentId": "1665538708869808130",
"childId": [
"0",
"1",
"2",
"3",
"4",
"5",
"6",
"7"
]
}
],
// 差集
differenceSet: []
}
},
created() {
this.subtractionFun(this.selectedText, this.brightTextArr)
},
methods: {
subtractionFun(selectedText, brightTextArr) {
this.differenceSet = JSON.parse(JSON.stringify(brightTextArr));
// 转换成对象，parentId为属性名，childId为属性值,
// 格式为 { 1665538708861419522: ['3', '4', '5', '9'] }
const brightTextMap = this.differenceSet.reduce((pre, cur) => {
return {
...pre,
[cur.parentId]: cur.childId,
};
}, {});
selectedText.forEach((item, index) => {
const childId = item.childId || [];
const parentChildId = brightTextMap[item.parentId] || [];
// 求两个数组的差集
const subtraction = parentChildId.filter((v) => !childId.includes(v));
const parentChildIdIndex = this.differenceSet.findIndex(
(v) => v.parentId === item.parentId
);
if (parentChildIdIndex >= 0) {
// 找到和原数组有相同有parentId并且有差集的那一项，替换成差集
this.differenceSet[parentChildIdIndex].childId = subtraction;
}
});
console.log(this.differenceSet, '差集')
},
}
})
</script>
</body>
</html>遇到的问题
1.将要对比的数组对象转换成以parentId为属性名，childId为属性值格式的对象，这样好对比。
格式为 { 1665538708861419522: ['3', '4', '5', '9'] }
2.需要找到和原数组有相同有parentId并且有差集的那一项，替换成差集
以上就是js获取两个数组对象的差集实现方法的详细内容，更多关于js获取两个数组对象差集的资料请关注脚本之家其它相关文章！