前端 reduce()用法总结

定义

reduce()方法对数组中的每个元素执行一个由您提供的reducer函数(升序执行),将其结果汇总为单个返回值。语法为:

array.reduce(function(accumulator, currentValue, currentIndex, arr), initialValue);
/*accumulator:  必需。累计器currentValue: 必需。当前元素currentIndex: 可选。当前元素的索引;                    arr:          可选。要处理的数组initialValue: 可选。传递给函数的初始值,相当于accumulator的初始值
*/

解释

简单来说就是对一个array执行reduce()方法,就是把其中的function()挨个地作用于array中的元素上,而且上一次的输出会作为下一次的一个输入。例如下面这个对array求和的例子。

let array = [1, 2, 3, 4, 5];
array.reduce((sum, curr) => sum + curr, 0); // 得到15

执行流程图如下:

f(a, b)= a + b, 也可以一次性写为:

array.reduce = f( f( f( f( f(0, 1) ,2) ,3), 4) ,5)

奉上一个GIF

动图封面

常见用法

求加法(乘法同理)

let arr = [1, 2, 3, 4, 5];
arr.reduce((sum, curr) => sum + curr, 0);       // 得到15

此基础上还可以求平均值

求最大值(最小值同理)

let arr = [23,123,342,12];
let max = arr.reduce((pre,cur,index,arr) => {return pre > cur ? pre : cur
});                                               // 得到 342

将字符串转换为整数

let str = "4321"
​
let strParseInt = str.split('')                   // 得到 ['4', '3', '2', '1', '4'].map(item => {return item.charCodeAt() - 48}) // 得到 [4, 3, 2, 1, 4].reduce((a, b) => {return a * 10 + b})        // 得到 43214

字符统计/单词统计同理

let str = 'abcdaabc';
​
str.split('').reduce((res, cur) => {res[cur] ? res[cur] ++ : res[cur] = 1 // 如果cur第一次出现,记为1return res;                           // 否则记录数+1
}, {})                                    // 得到 {a: 3, b: 2, c: 2, d: 1}

数组去重

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}
},[])                                     // 得到 [1, 2, 3, 4]

数组维度转换

let arr = [[0, 1], [2, 3], [4, 5]]      // 二维数组
let newArr = arr.reduce((pre,cur) => {return pre.concat(cur)              // 合并pre 与 cur, 并返回一个新数组
},[])
console.log(newArr);                    // 一维数组 [0, 1, 2, 3, 4, 5]

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/673128.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

5 步轻松上手,教你从 0 到 1 落地 Jmeter 接口自动化脚本!

Jmeter是进行接口测试的一款非常主流的工具,但绝大部分测试工程师,对于Jmeter接口测试脚本整理都是一知半解的。今天这篇文章,就以一个金融项目中接口为例,通过简单5步,教大家如何0代码编写Jmeter接口自动化脚本&#…

CPU和GPU有什么区别,玩游戏哪个更重要?

大家好!今天我们要聊的话题是CPU和GPU,它们在电脑中扮演着重要的角色,虽然看起来只是两个简单的缩写,但它们的功能和影响是截然不同的! 那么,究竟CPU和GPU有什么区别呢?在玩游戏时,…

Linux 系统开启网络服务

首先,大家新装的linux系统可能都没有安装vim工具,所以打开文件的方式是 vi /etc/sysconfig/network-scripts/ifcfg-ens33在这个界面把onboot改为yes,我这里是设置完的。然后通过下面语句重新启动服务就可以了。 service network restartcen…

2024.2.7日总结(小程序开发4)

页面导航 页面导航是页面之间的相互跳转&#xff1a; <a>链接location.href 小程序中实现页面导航的两种方式&#xff1a; 声明式导航 在页面上声明一个<navigator>导航组件通过点击<navigator>组件实现页面跳转 编程式导航 调用小程序的导航API&…

飞天使-k8s知识点15-kubernetes散装知识点4-CNI网络插件与kubectl

文章目录 CNI 网络插件安装任意节点运行kubectlAPI的版本区别与废弃API查询 CNI 网络插件安装 这里将以 Calico 为例&#xff0c;提供在 Kubernetes 1.20.6 版本上安装 CNI 插件的步骤。请注意&#xff0c;具体的步骤可能会因 CNI 插件的类型和你的特定环境而略有不同。设置 Ku…

BaseMapper中提供的方法(17种CRUD)

BaseMapper封装的17种增删改查方法 MybatisPlus框架中mapper层继承了BaseMapper接口&#xff0c;该接口中封装了常用的增删改查方法&#xff0c;共有17种&#xff0c;以下是方法的详情介绍 首先需要明确的括号内的一些对象定义 泛型T&#xff1a;实体类类型Param注解&#x…

iPhone解锁 AnyMP4 iPhone Unlocker

AnyMP4 iPhone Unlocker是一款功能强大的iPhone解锁软件&#xff0c;旨在帮助用户轻松解决iPhone密码忘记、设备锁定等问题。无论是屏幕密码、指纹解锁还是Face ID&#xff0c;该软件都能提供有效的解决方案。 这款软件支持多种iPhone型号&#xff0c;包括最新的iPhone 14系列…

2.3_9 吸烟者问题

2.3_9 吸烟者问题 问题描述 问题分析 假设一个系统有三个抽烟者进程和一个供应者进程。每个抽烟者不停地卷烟并抽掉它&#xff0c;但是要卷起并抽掉一支烟&#xff0c;抽烟者需要有三种材料&#xff1a;烟草、纸和胶水。三个抽烟者中&#xff0c;第一个拥有烟草、第二个拥有纸…

泛娱乐社交出海洞察,Flat Ads解锁海外增长新思路

摘要:解读泛娱乐社交应用出海现状与趋势,解锁“掘金”泛娱乐社交出海赛道新思路。 根据全球舆情监测机构 Meltwater 和社交媒体机构We are Social最新发布数据显示,全球社交媒体活跃用户数量已突破50亿,约占世界人口总数62.5%。庞大的用户数量意味着广阔的增量空间,目前,随着全…

使用HCPpipelines分割皮层

前段时间阅读了一篇文献,文章的做法我比较感兴趣,所以打算学习一下文献的做法。文章的最开始一部分是使用HCPpipelines对T1和T2像进行皮层分割,调用的是freesurfer6。https://github.com/Washington-University/HCPpipelines 一、工作环境准备 1.安装好FSL,版本在6.0.2以上…

Linux环境下配置HTTP代理服务器教程

大家好&#xff0c;我是你们可爱的Linux小助手&#xff01;今天&#xff0c;我将带你们一起探索如何在Linux环境下配置一个HTTP代理服务器。请注意&#xff0c;这不是一次火箭科学的实验&#xff0c;而是一次简单而有趣的冒险。 首先&#xff0c;我们需要明确什么是HTTP代理服…

Unity AnimationRigging无法修改权重?

个人理解&#xff0c;已解决无法修改权重的问题: unity自带的动画系统是在FixUpdate和Update之后LateUpdate之前执行&#xff0c;如果在这FixedUpdate或Update函数内更新AnimationRigging内的权重后&#xff0c;内部动画系统会覆盖权重的修改&#xff0c;导致无法正确更新&…

通过docker-compose部署NGINX服务,并使该服务开机自启

要在通过docker-compose部署的NGINX服务实现开机自启&#xff0c;你需要确保Docker守护进程在系统启动时自动运行&#xff0c;并配置docker-compose.yml文件以在容器中运行NGINX服务。以下是步骤&#xff1a; 确保Docker守护进程开机启动&#xff1a; 在Ubuntu/Debian上&#x…

FL Studio21最新正式版更新下载及实用功能详解

FL Studio 21是一款功能强大的音乐制作软件&#xff0c;它经历了多个版本的更新&#xff0c;每次更新都会增加新的功能和优化现有功能&#xff0c;提高用户体验和工作效率。以下是FL Studio 21的一些版本更新、功能特点以及下载方式的介绍&#xff1a; 版本更新&#xff1a; F…

C++判断回文字符串的两种方法

解法1&#xff1a;遍历一半字符串 若字符串个数为奇数遍历到n/2 若为偶数则遍历到n/2-1中间最后只剩一个字符不需判断 &#xff08;int是向下取整的&#xff09; 假设字符串长度为len&#xff0c;字符下标从0~len-1 先看第0个和第len-1字符是否相同&#xff0c; 在看第1和第…

20240203在WIN10下使用GTX1080配置stable-diffusion-webui.git不支持float16精度出错的处理

20240203在WIN10下使用GTX1080配置stable-diffusion-webui.git不支持float16精度出错的处理 2024/2/3 21:23 缘起&#xff1a;最近学习stable-diffusion-webui.git&#xff0c;在Ubuntu20.04.6下配置SD成功。 不搞精简版本&#xff1a;Miniconda了。直接上Anacoda&#xff01; …

IT行业针对大数据的安全文件传输的重要性

在数字化浪潮的推动下&#xff0c;数据已成为现代社会的宝贵资源。特别是大数据&#xff0c;以其海量、多样化、高速增长和低价值密度的特性&#xff0c;对信息技术&#xff08;IT&#xff09;行业产生了深远影响。大数据的应用不仅推动了云计算、物联网和人工智能等领域的发展…

【Docker】Docker Image(镜像)

文章目录 一、Docker镜像是什么&#xff1f;二、镜像生活案例三、为什么需要镜像四、镜像命令详解docker rmidocker savedocker loaddocker historydocker image prune 五、镜像操作案例六、镜像综合实战实战一、离线迁移镜像实战二、镜像存储的压缩与共享 一、Docker镜像是什么…

面试官都爱看的作品集,你做对了吗?

经常有朋友在群里问作品集的相关问题:设计师不知道从哪里开始作品集&#xff0c;觉得自己拿不到作品&#xff0c;作品集没有亮点&#xff0c;真的不知道怎么改进&#xff0c;作品集投递后没有回应&#xff0c;很受打击。 针对这些问题&#xff0c;我们将向您展示如何调整和改进…

正点原子--STM32基本定时器学习笔记(2)

目录 1. 相关寄存器介绍 1.1 控制寄存器 1(TIMx_CR1)​编辑 1.2 DMA/中断使能寄存器(TIMx_DIER) 1.3 状态寄存器(TIMx_SR) 1.4 计数器(TIMx_CNT) 1.5 预分频器(TIMx_PSC) 1.6 自动重装载寄存器(TIMx_ARR) 2. 工程建立 3. 导入tim.c文件 4. 相关HAL库函数介绍 4.1 H…