reduce()方法详解-程序员宅基地

技术标签: JavaScript  前端  javascript  开发语言  

定义和用法
reduce() 方法将数组缩减为单个值。
reduce() 方法为数组的每个值(从左到右)执行提供的函数。
函数的返回值存储在累加器中(结果/总计)。

注释:对没有值的数组元素,不执行 reduce() 方法。
注释:reduce() 方法不会改变原始数组。

语法

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

参数值

参数 描述
function(total, currentValue, index, arr) 必需。为数组中的每个元素运行的函数。
函数参数:
参数 描述
total 必需。initialValue,或函数先前返回的值。
currentValue 必需。当前元素的值。
index 可选。当前元素的数组索引。
arr 可选。当前元素所属的数组对象
initialValue 可选。作为初始值传递给函数的值。

1、实例解析 initialValue 参数

var arr = [1, 2, 3, 4];
var sum = arr.reduce(function(prev, cur, index, arr) {
    
    console.log(prev, cur, index);
    return prev + cur;
})
console.log(arr, sum);


VM6252:3 1 2 1
VM6252:3 3 3 2
VM6252:3 6 4 3
VM6252:6 (4) [1, 2, 3, 4] 10

这里可以看出,上面的例子index是从1开始的,第一次的prev的值是数组的第一个值。数组长度是4,但是reduce函数循环3次。

再来看一个

var  arr = [1, 2, 3, 4];
var sum = arr.reduce(function(prev, cur, index, arr) {
    
    console.log(prev, cur, index);
    return prev + cur;
},0);
console.log(arr, sum);


VM282:3 0 1 0
VM282:3 1 2 1
VM282:3 3 3 2
VM282:3 6 4 3
VM282:6 (4) [1, 2, 3, 4] 10

结论:如果没有提供initialValue,reduce 会从索引1的地方开始执行 callback 方法,跳过第一个索引。如果提供initialValue,从索引0开始。

2、reduce的简单用法

var  arr = [1, 2, 3, 4];
var sum = arr.reduce((x,y)=>x+y)
var mul = arr.reduce((x,y)=>x*y)
console.log( sum ); //求和,10
console.log( mul ); //求乘积,24

3、reduce的高级用法

(1)计算数组中每个元素出现的次数

let names = ['Alice', 'Bob', 'Tiff', 'Bruce', 'Alice'];

let nameNum = names.reduce((pre,cur)=>{
    
  if(cur in pre){
    
    pre[cur]++
  }else{
    
    pre[cur] = 1 
  }
  return pre
},{
    })
console.log(nameNum); //{Alice: 2, Bob: 1, Tiff: 1, Bruce: 1}

(2)数组去重

let arr = [1,2,3,4,4,1]
let newArr = arr.reduce((pre,cur)=>{
    
    if(!pre.includes(cur)){
    
      return pre.concat(cur)
    }else{
    
      return pre
    }
},[])
console.log(newArr);// [1, 2, 3, 4]

(3)将二维数组转化为一维

let arr = [[0, 1], [2, 3], [4, 5]]
let newArr = arr.reduce((pre,cur)=>{
    
    return pre.concat(cur)
},[])
console.log(newArr); // [0, 1, 2, 3, 4, 5]

(4)将多维数组转化为一维

let arr = [[0, 1], [2, 3], [4,[5,6,7]]]
const newArr = function(arr){
    
   return arr.reduce((pre,cur)=>pre.concat(Array.isArray(cur)?newArr(cur):cur),[])
}
console.log(newArr(arr)); //[0, 1, 2, 3, 4, 5, 6, 7]

(5)对象里的属性求和

var result = [
    {
    
        subject: 'math',
        score: 10
    },
    {
    
        subject: 'chinese',
        score: 20
    },
    {
    
        subject: 'english',
        score: 30
    }
];

var sum = result.reduce(function(prev, cur) {
    
    return cur.score + prev;
}, 0);
console.log(sum) //60
版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/wangxinxin1992816/article/details/124536863

智能推荐

智能运维都有哪些工作?智能运维哪些领域好_ai运维平台项目工作内容-程序员宅基地

文章浏览阅读367次,点赞8次,收藏10次。预防性维护:该工作内容涉及通过对设备的运行数据进行实时监控和分析,预测设备的故障和维护需求,提前制定维护计划,降低设备故障率和维护成本。某互联网公司使用智能运维技术对其数据库性能进行实时监控和分析,发现并解决了多个慢查询问题,提高了数据库的访问速度和响应时间。某金融机构使用智能运维技术对其服务器性能进行实时监控和分析,发现并解决了多个性能瓶颈问题,提高了系统的运行效率和用户体验。某大型电商企业使用智能运维技术对其网络流量进行实时监控和分析,发现并拦截了大量的网络攻击行为,保障了网络安全和稳定运行。_ai运维平台项目工作内容

梯度下降法——手工求解,Excel求解,python求解_梯度下降法手算-程序员宅基地

文章浏览阅读773次。目录一、梯度下降法原理1.形象的例子2.什么是梯度3.梯度下降算法原理二、手工求解三、Excel求解四、pyhton求解五、参考资料一、梯度下降法原理梯度下降法(Gradient Descent,GD)是一种常用的求解无约束最优化问题的方法,在最优化、统计学以及机器学习等领域有着广泛的应用。1.形象的例子假设这样一个场景:一个人需要从山的某处开始下山,尽快到达山底。在下山之前他需要确认两件事:下山的方向下山的距离这是因为下山的路有很多,他必须利用一些信息,找到从该处开始最陡峭的方向下山,这_梯度下降法手算

51Nod 2654 最小距离最大 c/c++ 题解_c++给出n个位置(数轴上的坐标值),从中选出k个,让这k个位置相邻两个之间的距离(相-程序员宅基地

文章浏览阅读1.5k次。题目描述给出n个位置,从中选出k个,让这k个位置相邻两个之间的距离尽可能的大,尽可能大的意思是这k-1个距离的最小值尽量大。输出这个最大的最小值。样例解释:选位置:1 5 9。输入第一行:2个数n和k(2 <= n <= 100000, 2 <= k <= 10000, k <= n)后面n行:每行一个数Pi,表示具体位置(0 <= Pi <=..._c++给出n个位置(数轴上的坐标值),从中选出k个,让这k个位置相邻两个之间的距离(相

DataMatrix 码提取流程_dm二维码-程序员宅基地

文章浏览阅读2.7k次。DM 码是一种二维矩阵码,由深浅两种不同灰度的码块组成棋盘的样式,其具有正方形和长方形两种符号形式。图1表示了一个DM 码的区域划分。DM 码由定位图形和数据区域组成,定位图形又由一组垂直的实线边缘和虚线边缘组成,实线边缘形成一个“L”形的特征边,用于提供条码的位置基准和方向基准,虚线边缘由深浅两色码块切换组成,其提供二维条码的尺寸信息;数据区域分布着深色和浅色的码块,分别代表数据位“1”和“0”,通过对条码以编码规则顺序读出每个码块代表的数据位信息,得到一组承载一定信息的数据流,按DM 码的编码协议可译码_dm二维码

main,restricted,universe,multiverse有什么区别_wily main restricted 和 jammy main restricted unive-程序员宅基地

文章浏览阅读3.9k次,点赞2次,收藏6次。这是按软件的自由度来分的。main:完全的自由软件。restricted:不完全的自由软件。universe:ubuntu官方不提供支持与补丁,全靠社区支持。muitiverse:非自由软件,完全不提供支持和补丁。..._wily main restricted 和 jammy main restricted universe multiverse

MATLAB绘制音频波形及频谱_matlab画音频信号的频谱图-程序员宅基地

文章浏览阅读3.6w次,点赞99次,收藏450次。[x,Fs]=audioread('test.mp3');x = x(:,1);x = x';N = length(x);%求取抽样点数t = (0:N-1)/Fs;%显示实际时间y = fft(x);%对信号进行傅里叶变换f = Fs/N*(0:round(N/2)-1);%显示实际频点的一半subplot(211);plot(t,x,'g');%绘制时域波形xlabel('Time / (s)');ylabel('Amplitude');title('信号的波形');grid;s_matlab画音频信号的频谱图

随便推点

HDFS_副本和认证_一证三副本-程序员宅基地

文章浏览阅读342次。一、 三副本策略三副本策略的含义1)如果写请求方所在机器是其中一个DataNode,则直接存放在本地,否则随机在集群中选择一个DataNode2)第二个副本存放在不同于第一个副本所在的机架3)第三个副本存放于第二个副本所在的机架,但是属于不同的节点三副本策略的使用需要开启机架感知功能,才能正常使用副本放置策略:net.topology.script.file.name_一证三副本

SpringBoot项目中static和template文件夹的区别-程序员宅基地

文章浏览阅读1.5k次。SpringBoot项目创建后,resources下默认有两个文件夹static和template.一般static存放静态资源,template存放动态资源. 在static文件夹下新建cc.html,浏览器输入localhost:8080/cc.html可以正常访问.同样的操作在访问te..._springboot的static与templates目录编译后

[译]MQTT 通配符_为什么mqtt首页加了/之后会多个空格行-程序员宅基地

文章浏览阅读1.4w次,点赞13次,收藏13次。原文Appendix A - Topic wildcards译文一个订阅可能包含特殊字符,允许你一次定义多个主题。主题层次分隔符被用来在主题中引入层次。多层的通配符和单层通配符可以被使用,但他们不能被使用来做发布者的消息。主题层级分隔符// 被用来分割主题树的每一层,并给主题空间提供分等级的结构。当两个通配符在一个主题中出现的时候,主题层次分隔符的使用是很重要的。多层通配符## 是一个匹配主题中任意_为什么mqtt首页加了/之后会多个空格行

排球计分程序(记分员)-程序员宅基地

文章浏览阅读181次。1.计划:做这个任务大概需要六天。2.需求: 作为一名现场记分员,我希望详细记录比赛现场比分增长情况,以便观众及运动员、教练员及时掌握比赛状况。3.生成设计文档: 1) 建一个数据库,将各个国家的比赛情况记录其中。 2)对每场比赛进行计分记录。 3)记录每个球员的进球得分,队伍中担任位置,失误。 4)对个人及每场比赛进行累计计算。4..._排球记分牌c语言程序

通过Visualizing Representations来理解Deep Learning、Neural network、以及输入样本自身的高维空间结构...-程序员宅基地

文章浏览阅读907次。catalogue1. 引言2. Neural Networks Transform Space - 神经网络内部的空间结构3. Understand the data itself by visualizing high-dimensional input dataset - 输入样本内隐含的空间结构4. Example 1: Word Embeddings in NLP -..._如何写visualisation and deep learning

FATE_fate框架中怎么查看hostid-程序员宅基地

文章浏览阅读125次。最近xhd正在玩一款叫做FATE的游戏,为了得到极品装备,xhd在不停的杀怪做任务。久而久之xhd开始对杀怪产生的厌恶感,但又不得不通过杀怪来升完这最后一级。现在的问题是,xhd升掉最后一级还需n的经验值,xhd还留有m的忍耐度,每杀一个怪xhd会得到相应的经验,并减掉相应的忍耐度。当忍耐度降到0或者0以下时,xhd就不会玩这游戏。xhd还说了他最多只杀s只怪。请问他能升掉这最后一级吗?Inp..._fate框架中怎么查看hostid

推荐文章

热门文章

相关标签