Several ways to deduplicate array objects in js
First we define the form of the array
let arrObj = [
{
name: "张三", key: '1' },
{
name: "李四", key: '2' },
{
name: "王五", key: '3' },
{
name: "张三", key: '1' },
{
name: "李四", key: '2' }
];
Requirement: Delete objects with the same key value, the following is the desired result
1. Method 1: Double-layer for loop
Two-by-two comparison, if the key value of the latter object is equal to the key value of the previous object, delete the latter object.
let arrObj = [
{
name: "张三", key: '1' },
{
name: "李四", key: '2' },
{
name: "王五", key: '3' },
{
name: "张三", key: '1' },
{
name: "李四", key: '2' }
]
function uniqueArr (arr) {
for (let i = 0; i < arr.length; i++) {
for (let j = i + 1; j < arr.length; j++) {
if (arr[i].key == arr[j].key) {
arr.splice(j, 1)
j--
}
}
}
return arr
}
console.log(uniqueArr(arrObj));
2. The method of object access property
Use the method of object access attribute to judge whether the attribute value exists.
let arrObj = [
{
name: "张三", key: '1' },
{
name: "李四", key: '2' },
{
name: "王五", key: '3' },
{
name: "张三", key: '1' },
{
name: "李四", key: '2' }
]
function uniqueArr (arr) {
var result = []
var obj = {
}
for (var i = 0; i < arr.length; i++) {
if (!obj[arr[i].key]) {
result.push(arr[i])
obj[arr[i].key] = true
}
}
return result
}
console.log(uniqueArr(arrObj));
3. Map() method
The has method can determine whether the specified element exists in the Map object, and return true if there is, otherwise return false
The set method can add new elements to the Map object map.set(key, value)
The values method can return the traverser object of the value of the Map object
let arrObj = [
{
name: "张三", key: '1' },
{
name: "李四", key: '2' },
{
name: "王五", key: '3' },
{
name: "张三", key: '1' },
{
name: "李四", key: '2' }
]
// 方法一:
let map = new Map()
for (let item of arrObj) {
if (!map.has(item.key)) {
map.set(item.key, item)
};
};
arr = [...map.values()]
console.log(arr)
// 方法二: (代码较为简洁)
const map = new Map()
const newArr = arrObj.filter(v => !map.has(v.key) && map.set(v.key, 1))
console.log(newArr);
4. reduce method
let arrObj = [
{
name: "张三", key: '1' },
{
name: "李四", key: '2' },
{
name: "王五", key: '3' },
{
name: "张三", key: '1' },
{
name: "李四", key: '2' }
]
var obj = {
}
arrObj = arrObj.reduce(function (item, next) {
obj[next.key] ? '' : obj[next.key] = true && item.push(next)
return item
}, [])
console.log(arrObj);