reduce()方法的应用

reduce() 是 JavaScript 数组(Array)对象的一个方法,它接收一个函数作为累加器(accumulator),数组中的每个值(从左到右)开始缩减,最终为一个值。

reduce() 方法的基本语法如下:

array.reduce(function(accumulator, currentValue, currentIndex, array) {  // 返回累加器积累的结果  
}, initialValue);

参数说明

function(accumulator, currentValue, currentIndex, array): 执行数组中每个元素调用的函数,它包含四个参数。
accumulator(必需):累积器,累积回调函数的返回值;它是上一次调用回调时返回的累积值,或者是initialValue(如果提供了的话)。
currentValue(必需):数组中正在处理的当前元素。
currentIndex(可选):数组中正在处理的当前元素的索引。如果提供了initialValue,则索引为0,否则从索引1起始。
array(可选):调用reduce()的数组。
initialValue(可选):作为第一次调用callback函数时的第一个参数的值。如果没有提供初始值,则将使用数组中的第一个元素。在没有初始值的空数组上调用reduce将报错。
reduce() 方法非常适合将数组元素组合成单个输出值,比如求和、求积或者将数组对象合并为单一对象。

以下是一些使用 reduce() 方法的例子:

求和

const numbers = [1, 2, 3, 4, 5];  
const sum = numbers.reduce((accumulator, currentValue) => accumulator + currentValue, 0);  
console.log(sum); // 输出: 15

数组元素去重:

const array = [1, 2, 2, 3, 4, 4, 5];  
const uniqueArray = array.reduce((accumulator, currentValue) => {  if (!accumulator.includes(currentValue)) {  accumulator.push(currentValue);  }  return accumulator;  
}, []);  
console.log(uniqueArray); // 输出 [1, 2, 3, 4, 5]

将多维数组转换为一维数组:

const nestedArray = [1, [2, 3], [4, [5, 6]]];  
const flattenedArray = nestedArray.reduce((accumulator, currentValue) => {  return accumulator.concat(Array.isArray(currentValue) ? currentValue.reduce((a, b) => a.concat(b), []) : accumulator.concat(currentValue));  
}, []);  
console.log(flattenedArray); // 输出 [1, 2, 3, 4, 5, 6]

计算数组中每个元素出现的次数:

const votes = ["vue", "react", "angular", "vue", "react", "angular", "vue", "react", "vue"];  
const count = votes.reduce((accumulator, currentValue) => {  if (!accumulator[currentValue]) {  accumulator[currentValue] = 1;  } else {  accumulator[currentValue]++;  }  return accumulator;  
}, {});  
console.log(count); // 输出 { vue: 4, react: 3, angular: 2 }

对象属性的累加:

const items = [  { name: 'item1', price: 10 },  { name: 'item2', price: 20 },  { name: 'item3', price: 30 }  
];  
const totalPrice = items.reduce((accumulator, currentValue) => accumulator + currentValue.price, 0);  
console.log(totalPrice); // 输出 60

字符串连接:

虽然这可以用 join() 方法更简单地完成,但 reduce() 也可以用来连接数组中的字符串元素。

const words = ['Hello', 'world', '!'];  
const sentence = words.reduce((accumulator, currentValue) => accumulator + ' ' + currentValue);  
console.log(sentence); // 输出 "Hello world !"

这些只是 reduce() 方法的一些应用场景示例。实际上,由于 reduce() 的灵活性,它可以用于任何需要累积或缩减数组元素的场景。

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

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

相关文章

Redis 除了做缓存,还能做什么?

分布式锁:通过 Redis 来做分布式锁是一种比较常见的方式。通常情况下,我们都是基于 Redisson 来实现分布式锁。关于 Redis 实现分布式锁的详细介绍,可以看这篇文章:分布式锁详解open in new window 。限流:一般是通过 …

json-server 安装成功,查看版本直接报错。安装默认版本埋下的一个坑,和node版本不匹配

文章目录 一、作者的错误二、作者安装的过程三、版本问题的解决方式四、安装成功,显示命令不存在的解决思路五、安装失败的解决思路六、json-server运行命令参考文档 一、作者的错误 安装成功 错误原文 file:///C:/Users/ljj/AppData/Roaming/nvm/v14.18.1/node_g…

go语言基础笔记

1.基本类型 1.1. 基本类型 bool int: int8, int16, int32(rune), int64 uint: uint8(byte), uint16, uint32, uint64 float32, float64 string 复数:complex64, complex128 复数有实部和虚部,complex64的实部和虚部为32位,complex128的实部…

Vue首屏优化方案

在Vue项目中,引入到工程中的所有js、css文件,编译时都会被打包进vendor.js,浏览器在加载该文件之后才能开始显示首屏。若是引入的库众多,那么vendor.js文件体积将会相当的大,影响首屏的体验。可以看个例子:…

Unload-labs

function checkFile() {var file document.getElementsByName(upload_file)[0].value;if (file null || file "") {alert("请选择要上传的文件!");return false;}//定义允许上传的文件类型var allow_ext ".jpg|.png|.gif";//提取上传文件的类…

初见Dynamo2.13 for Revit2023~

Hello大家好!我是九哥~ 今天我们来聊聊Dynamo2.13 for Revit有哪些新功能(后台回复"Revit2013"获取)~ 首先,Dynamo2.13版本其实早就发布了,官方博客更是花了三篇文章的篇幅来详细介绍,小伙伴…

C# EPPlus导出dataset----Excel1

仅限XLSX 2007以后版本(2007之前版本不支持) 目录 一、安装EPPlus程序包 二、全局参数 二、配置许可证

Hack The Box-Monitored

目录 信息收集 rustscan dirsearch WEB web信息收集 snmpwalk curl POST身份验证 漏洞探索 漏洞挖掘 sqlmap 登录后台 提权 get user get root 信息收集 rustscan ┌──(root㉿ru)-[~/kali/hackthebox] └─# rustscan -b 2250 10.10.11.248 --range0-65535 --…

今天我们来学习一下关于MySQL数据库

目录 前言: 1.MySQL定义: 1.1基础概念: 1.1.1数据库(Database): 1.1.2表(Table): 1.1.3记录(Record)与字段(Field): …

C#,入门教程(27)——应用程序(Application)的基础知识

上一篇: C#,入门教程(26)——数据的基本概念与使用方法https://blog.csdn.net/beijinghorn/article/details/124952589 一、什么是应用程序 Application? 应用程序是编程的结果。一般把代码经过编译(等)过程,最终形成的可执行 或 可再用 的文件称为应用程序。可执行文…

IIFE函数

IIFE(Immediately Invoked Function Expression)是立即调用函数表达式的缩写。它是一种 JavaScript 函数执行方式,定义一个匿名函数并立即调用它,通常用于创建一个私有作用域以避免变量污染全局作用域。 (function() {var messag…

GaussDB数据库的索引管理

目录 一、引言 二、GaussDB数据库中的索引基本概念 1. 什么是GaussDB索引? 2. GaussDB索引的作用 三、GaussDB支持的索引类型 1. B-Tree索引 2. GIN索引 3. GiST索引 4. SP-GiST索引 四、创建和管理GaussDB索引 1. 创建索引 2. 删除索引 3. 索引的优化…

【AI论文阅读笔记】ResNet残差网络

论文地址:https://arxiv.org/abs/1512.03385 摘要 重新定义了网络的学习方式 让网络直接学习输入信息与输出信息的差异(即残差) 比赛第一名1 介绍 不同级别的特征可以通过网络堆叠的方式来进行丰富 梯度爆炸、梯度消失解决办法:1.网络参数的初始标准化…

RabbitMQ详解与常见问题解决方案

文章目录 什么是 RabbitMQ?RabbitMQ 和 AMQP 是什么关系?RabbitMQ 的核心组件有哪些?RabbitMQ 中有哪几种交换机类型?Direct Exchange(直连交换机)Topic Exchange(主题交换机)Headers Exchange(头部交换机)Fanout Exchange(广播交…

安装linux_centos7虚拟机_开启网络_ssh_防火墙

文章目录 安装linux_centos7虚拟机_开启网络_ssh_防火墙安装centos7虚拟机1. 进入VMware --> 点击文件 --> 新建虚拟机2. 选择典型 --> 选择下一步3. 选择--> 稍后安装操作系统4. 选择--> Linux --> CentOS 7 64位5. 在虚拟机名称输入(虚拟机名) --> 选择…

李三清研究引领力学定律新篇章,光子模型图揭秘

一周期内,垂直,曲率不变,方向转向互变,正向反向互变,左旋右旋互变。变无限粗或变无限厚才发生质变,且属于由内向外变换,所以对应变换就是由内点向外点变换。 由于方向转向不能分割,…

[数据集][目标检测]昆虫检测数据集VOC+YOLO格式1873张7类别

数据集格式:Pascal VOC格式YOLO格式(不包含分割路径的txt文件,仅仅包含jpg图片以及对应的VOC格式xml文件和yolo格式txt文件) 图片数量(jpg文件个数):1873 标注数量(xml文件个数):1873 标注数量(txt文件个数):1873 标注…

【Vue2】组件通信

父子通信 父 -> 子 子 -> 父 props 校验 props: {校验的属性名: {type: 类型, // Number String Boolean ...required: true, // 是否必填default: 默认值, // 默认值validator (value) {// 自定义校验逻辑return 是否通过校验}} },data 的数据是自己的 → 随便改pr…

浅浅探索Memcached

一、NoSQL介绍 NoSQL是对 Not Only SQL、非传统关系型数据库的统称。 NoSQL一词诞生于1998年,2009年这个词汇被再次提出指非关系型、分布式、不提供ACID的数据库设计模式。 随着互联网时代的到来,数据爆发式增长,数据库技术发展日新月异&a…

N沟道功率MOSFET--FDA59N30 助力提高电源效率 为设备节能做出贡献

FDA59N30 UniFETTM MOSFET 是高压 MOSFET产品,基于平面条形和 DMOS 技术。 该 MOSFET 产品专用于降低通态电阻,并提供更好的开关性能和更高的雪崩能量强度。适用于开关电源转换器应用,如功率因数校正(PFC)、平板显示器…