JavaScript 数组对象去重方法
今天在进行星系图谱开发时,由于节点数据重复从而导致图谱渲染失败,之前遇到过数组的去重,对于正常的数组去重的方法有很多,但对于数组对象的去重就有点蒙圈了,于是自己就花了一点时间总结了下。以下面的数组对象为例:
let data = [{
number: 22.687,
value: 114.014
}, {
number: 22.687,
value: 112.004
}, {
number: 22.837,
value: 114.014
}, {
number: 26.687,
value: 115.014
}, {
number: 22.687,
value: 115.014
}, {
number: 22.687,
value: 114.014
}];
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
# 方法一:对象法去重(Es5)
let obj = {};
data = data.reduce(function (item, next) {
obj[next.number] ? '' : obj[next.number] = true && item.push(next);
return item;
}, []);
console.log(data);
1
2
3
4
5
6
2
3
4
5
6
# 方法二:新建数据双重循环去重(Es5)
let allArr = []; //建立新的临时数组
for (let i = 0; i < data.length; i++) {
let flag = true;
for (let j = 0; j < allArr.length; j++) {
if (data[i].number == allArr[j].number) {
flag = false;
};
};
if (flag) {
allArr.push(data[i]);
};
};
console.log(allArr);
1
2
3
4
5
6
7
8
9
10
11
12
13
2
3
4
5
6
7
8
9
10
11
12
13
或者
let temp = [];
data.forEach(function(a) {
let check = temp.every(function(b) {
return a.number !== b.number;
})
check ? temp.push(a) : ''
})
console.log(temp);
1
2
3
4
5
6
7
8
2
3
4
5
6
7
8
# 方法三:Map()去重(Es6)
let number = 'number';
let map = new Map();
for (let item of data) {
if (!map.has(item.number)) {
map.set(item.number, item);
}
};
let newArr = [...map.values()];
console.log(newArr);
1
2
3
4
5
6
7
8
9
10
2
3
4
5
6
7
8
9
10
# 方法四:冒泡排序法去重(Es5)
for (let i = 0; i < data.length - 1; i++) {
for (let j = i + 1; j < data.length; j++) {
if (data[i].name == data[j].name) {
data.splice(j, 1);
//因为数组长度减小1,所以直接 j++ 会漏掉一个元素,所以要 j--
j--;
}
}
}
console.log(data);
1
2
3
4
5
6
7
8
9
10
2
3
4
5
6
7
8
9
10
上次更新: 2024/01/30, 00:35:17
- 02
- Node与GLIBC_2.27不兼容解决方案08-19
- 03
- Git清空本地文件跟踪缓存08-13