使用ES6的reduce函数,根据key去重

最近很着迷于ES6的函数,让代码变得更优雅。ES6里的reduce函数,平时用的不是特别多,真正用起来发现还是挺好用的。

想要实现的效果为:

原数组:

let rawArr = [{id:‘123‘},{id:‘456‘},{id:‘789‘},{id:‘123‘}];

根据id去重后的结果为

let rawArr = [{id:‘123‘},{id:‘456‘},{id:‘789‘}];

reduce函数介绍

在说如何去重之前,先来介绍一下reduce函数:

array.reduce(callback[, initialValue]);

写的具体一点,是这样子

array.reduce(function(total, currentValue, currentIndex, array), initialValue);

reduce方法会遍历数组,并且为数组中的每个元素,执行定义的callback方法,并把结果汇总为单个值返回。

参数定义

callback:为每个元素执行的方法,它有以下四个参数

   total:累计器,也是最终返回的结果

   currentValue:当前遍历的元素

   currentIndex:当前遍历的元素的下标,可选

   array:原始数组,可选

initialValue:初始值

需要注意的是,如果定义了initialValue,那么total的初始值就是initialValue,遍历则从第0项开始。

如果没有定义,则total的初始值,会是第0项元素,遍历则从第1项开始。

利用reduce函数封装去重方法

由于最终希望返回的是一个去重后的数组,所以reduce函数的初始值要设置为空数组[],这样,在遍历到符合条件的元素的时候,才能push进数组里。

我封装了一个util工具方法:入参为原始数组,以及需要根据哪个key值去重,返回结果为最终去重后的数组

function uniqueByKey(arr,key) {
    let hash = {};
    let result = arr.reduce((total, currentValue) => {
        if (!hash[currentValue[key]]) { //如果当前元素的key值没有在hash对象里,则可放入最终结果数组
          hash[currentValue[key]]= true; //把当前元素key值添加到hash对象
          total.push(currentValue); //把当前元素放入结果数组
        }
        return total; //返回结果数组
      },[]);
    return result;
}

最后,奉上MDN的reduce介绍地址,写的非常详细

https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Array/Reduce

  

原文地址:https://www.cnblogs.com/daisygogogo/p/10624806.html

时间: 2024-10-15 02:39:39

使用ES6的reduce函数,根据key去重的相关文章

使用es6新增Set函数快速数组去重

使用new Set()快速数组去重: let arr = [1, 2, 2, 3, 4, 5, 5, 5, 6] let set = new Set([...arr]) console.log([...set]) //[1, 2, 3, 4, 5, 6] function SetArr(array) { return Array.from(new Set(array)); } console.log(SetArr([1, 1, 2, 2, 3, 4, 4])) // [1, 2, 3,4] 原文

MapReduce的reduce函数里的key用的是同一个引用

最近写MapReduce程序,出现了这么一个问题,程序代码如下: 1 package demo; 2 3 import java.io.IOException; 4 import java.util.HashMap; 5 import java.util.Map; 6 import java.util.Map.Entry; 7 8 import org.apache.hadoop.fs.FSDataOutputStream; 9 import org.apache.hadoop.fs.FileS

ES6 入门系列 - 函数的扩展

1函数参数的默认值 基本用法 在ES6之前,不能直接为函数的参数指定默认值,只能采用变通的方法. function log(x, y) { y = y || 'World'; console.log(x, y); } log('Hello') // Hello World log('Hello', 'China') // Hello China log('Hello', '') // Hello World 上面代码检查函数log的参数y有没有赋值,如果没有,则指定默认值为World.这种写法的

es6中reduce()方法和reduceRight()方法

es6中reduce()方法从左往右开始 参数:prev:它是上一次调用回调时返回的结果,每次调用的结果都会给prev cur:当前的元素 index:当前的索引 arr:循环的数组 返回值:函数累计处理的结果 demo:求数组的和. var a = [1,2,3,4,5,6,7,8,9,10] var str = a.reduce(function(prev,cur,index,arr){ return prev + cur ;})str // 55;求阶乘 var a = [1,2,3,4,

弄明白python reduce 函数

作者:Panda Fang 出处:http://www.cnblogs.com/lonkiss/p/understanding-python-reduce-function.html 原创文章,转载请注明作者和出处,未经允许不可用于商业营利活动 reduce() 函数在 python 2 是内置函数, 从python 3 开始移到了 functools 模块. 官方文档是这样介绍的 reduce(...) reduce(function, sequence[, initial]) -> valu

filter、map、sorted和reduce函数

filter filter()函数接收一个函数 f 和一个list,这个函数 f 的作用是对每个元素进行判断,返回 True或 False,filter()根据判断结果自动过滤掉不符合条件的元素,返回由符合条件元素组成的新list. 例如,要从一个list [1, 4, 6, 7, 9, 12, 17]中删除偶数,保留奇数,首先,要编写一个判断奇数的函数: def is_odd(x): return x % 2 == 1 然后,利用filter()过滤掉偶数: >>>list(filte

数组中的reduce 函数理解

第一次见到reduce 是在js 的高级程序设计中,它的意思是把一个数组减少为一个数,举的例子是数组中元素的求和.它接受一个函数作为参数,函数又有两个参数,一个是prev, 前一个值,一个是next, 后一个值,然后函数体就是返回相加的值. let array = [1, 3, 5]; let sum = array.reduce((prev, next) => { return prev + next; }) console.log(sum); 我对reduce 的理解也仅限于此,只停留在了表

python的reduce()函数

reduce()传入的函数 f 必须接收两个参数,reduce()对list的每个元素反复调用函数f,并返回最终结果值.(也就是最后一次是返回值) #reduce()函数 from functools import reduce def f(x,y): return x+y print(reduce(f, [1, 3, 5, 7, 9])) # 先计算头两个元素:f(1, 3),结果为4: # 再把结果和第3个元素计算:f(4, 5),结果为9: # 再把结果和第4个元素计算:f(9, 7),结

使用python实现内置map,filter,reduce函数

map函数 # -*- coding: cp936 -*- def myselfmap(f,*args):     def urgymap(f,args):         if args==[]:             return []         else:             return [f(args[0])]+urgymap(f,args[1:])     if list(args)[0]==[]:             #*args有多个参数被传递时返回tuple