今天分享一道面试手写笔试题，主要考察数据去重问题
原题是这样的，给出一组数据，去掉id相同的数据并进行排序
const arr = [ {id: 0,pid: 1,order: 2,}, { id: 0,pid: 1,order: 2 }, {id: 0, pid: 1,order: 3,}, {id: 1,pid: 1,order: 3,}, {id: 2,pid: 2,order: 5,}, {id: 3,pid: 2,order: 4,} ];
过滤后的结果
[ { id: 0, pid: 1, order: 2 }, { id: 1, pid: 1, order: 3 }, { id: 2, pid: 2, order: 5 }, { id: 3, pid: 2, order: 4 } ]
方法一：主要是利用对象存储id为key，对象的key不会重复
const quchong = (arr) => { const ret = [], obj = {}; arr.forEach(v => { // if (!obj[v.id]) { // ret.push(v) // } /** * 与下面等价 */ if (!Reflect.has(obj, v.id)) { ret.push(v) } obj[v.id] = v.id; }) return ret.sort((a, b) => a.id - b.id); }
方法二：利用reduce结合findeIndex
const quchong2 = (arr) => { return arr.reduce((cur, prev) => { if (cur.findIndex(v => v.id === prev.id) === -1) { cur.push(prev) } return cur.sort((a, b) => a.id - b.id); }, []) }
方法三： 通过Set去重对应的id，然后根据reduce计算方法，将原数组数据映射到对象中，然后返回对象的值
const quchong3 = (arr) => { const arrId = [...new Set(arr.map(v => v.id))]; return arrId.reduce((cur, id) => { if (!cur[id]) { cur[id] = arr.find(v => v.id === id) } return Object.values(cur).sort((a, b) => a.id - b.id) }, {}) }
方法四： 利用Map对数据进行过滤
const quchong4 = (arr, map = new Map()) => { arr.forEach(v => { if (!map.has(v.id)) { map.set(v.id, v) } }); return Object.values(map).sort((a, b) => a.id - b.id) } console.log('quchong1:', quchong(arr)); console.log('quchong2:', quchong2(arr)); console.log('quchong3:', quchong3(arr)); console.log('quchong4:', quchong4(arr));
总结
- 主要考察数据过滤，我们利用对象
key不重复，先判断对象中是否有key,向数组中添加数据，然后将当前的id作为对象的key,如果有就不向数组中添加数据 - 我们也可以结合
reduce这个计算方法，结合findIndex判断是否有id相同的 - 通过
reduce与Set,Set过滤相同的id,然后进行计算循环，判断cur中是否有pid - 利用
Map对原有数据进行去重，将没有的值，以id作为key，将当前项变成值，然后调用Object.values(map)返回其值即可。 - 本文示例源码code example[1]
