【实战总结】Map + reduce 实现对象数组中去掉重复的对象

622 阅读2分钟

1.Map对象简述

定义:Map对象保存键/值对,是键/值对的集合。任何值(对象或者原始值) 都可以作为一个键或一个值。Object结构提供了“字符串—值”的对应,Map结构提供了“值—值”的对应。

Object 和 Map 对象的对比:

相似点: 都允许你按键存取一个值、删除键、检测一个键是否绑定了值。

不同点

    1. 一个对象的键只能是字符串或者 Symbols,但一个 Map 的键可以是任意值,包括函数、对象、基本类型。
    1. Map 中的键值是有序的,而添加到对象中的键则不是。因此,当对它进行遍历时,Map对象是按插入的顺序返回键值。
    1. 通过 size 属性直接获取一个 Map 的键值对个数,而 Object 的键值对个数只能手动计算。
    1. Map 是可迭代的,而 Object 的迭代需要先获取它的键数组然后再进行迭代。
    1. Object 都有自己的原型,所以原型链上的键名有可能和对象上的键名产生冲突。虽然 ES5 开始可以用 map = Object.create(null) 来创建一个没有原型的对象,但是这种用法不太常见。
    1. Map 在频繁增删键值对的场景下会有些性能优势。

2.Reduce方法简述

定义:reduce() 方法接收一个函数作为累加器,数组中的每个值(从左到右)开始缩减,最终计算为一个值。

语法: array.reduce(callback(accumulator, currentValue[, index[, array]])[, initialValue])

accumulator:(累计器,累计回调的返回值; 它是上一次调用回调时返回的累积值,或initialValue)
currentValue:(当前处理的元素)
index:(当前处理元素的索引)
array:(调用reduce的源数组)
initialValue:(作为第一次调用 callback函数时的第一个参数的值。 如果没有提供初始值,则将使用数组中的第一个元素。 在没有初始值的空数组上调用 reduce 将报错)

3.用法

// data
     var resources = [
            { name: "张三", age: "18" },
            { name: "张三", age: "19" },
            { name: "张三", age: "20" },
            { name: "李四", age: "19" },
            { name: "王五", age: "20" },
            { name: "赵六", age: "21" }
        ]
        
     let listMap = new Map()
     resources = resources.reduce((prev, curv) => {
        let mapKey = curv["name"]
        listMap.get(mapKey) ? "" : listMap.set(mapKey, true) && prev.push(cur)
        return prev
     }, []);
     // 释放
     listMap = null
     console.log("结果", resources);

参考文章:

blog.csdn.net/moqiuqin/ar…

www.jianshu.com/p/e3e1745a3…