一.函数介绍

  • Array.reduce()方法是对数组进行遍历,返回一个计算后的值

  • 使用方法:

Array.reduce((acc, cur, idx, src) => { }, initialValue)

  • callback回调函数接收4个参数:

    Accumulator (acc) (累计器) 如果传入了initialValue,Accumulator的初始值就是initialValue,没传入就是数组的第一个值

    Current Value (cur) (当前值)

    Current Index (idx) (当前索引)如果传入了initialValue,索引从0开始,没传入从1开始

    Source Array (src) (源数组)

initialValue 指定的初始值,初始值可以是数字,数组,对象

二.例子

2.1.数组求和

const arr = [1, 2, 3, 4, 5, 6];
let c = arr.reduce((a, b) => {
console.log(a, b);
return a + b;
});
console.log(c);

2.2.对象数组求和

const arr = [
{
name: '张三',
count: 1
},
{
name: '李四',
count: 2
},
{
name: '王五',
count: 3
},
{
name: '赵六',
count: 4
}
];
/**
* 对象数组求和
* pre:number
* cur:当前对象
* 最后的0:初始值
*/
const sum = arr.reduce((pre, cur) => {
console.log(pre, cur);
return pre + cur.count;
}, 0);
console.log(sum);

2.3.统计次数

/**
* 统计字母出现的个数
*/
let str = 'HelloWorld';
let arrStr = str.split('');
type TNumb = {
name: string;
count: number;
};
let arrFinal = arrStr.reduce((acc: TNumb[], cur: string): TNumb[] => {
let existItem = acc.find(it => it.name === cur);
if (!existItem) {
acc.push({ name: cur, count: 1 });
} else {
existItem.count++;
}
return acc;
}, []);
console.log(arrFinal);

2.4.求字符串数组中哪个出现的次数最多

let arr1 = ['李明', '韩梅梅', '张三', '李明', '李明', '张三', '韩梅梅', '李明', 'Jack', '韩梅梅'];
type TNumb = {
name: string;
count: number;
};
let arrFinal = arr1.reduce((acc: TNumb[], cur: string): TNumb[] => {
let existItem = acc.find(it => it.name === cur);
if (!existItem) {
acc.push({ name: cur, count: 1 });
} else {
existItem.count++;
}
return acc;
}, []);
console.log(arrFinal); let a = arrFinal.reduce((acc: TNumb, cur: TNumb) => {
return acc.count > cur.count ? acc : cur;
});
console.log(a); // 去重
let b = arrFinal.reduce((acc: string[], cur: TNumb) => {
if (!acc.includes(cur.name)) {
acc.push(cur.name);
}
return acc;
}, []);
console.log(b);

2.5.二维数组转一维数组

// 二维数组转一维数组
let numArr: number[][] = [];
numArr[0] = [1, 2, 3, 4];
numArr[1] = [5, 6, 7];
numArr[2] = [9, 10, 11];
let numArrNew = numArr.reduce((acc, cur) => {
return acc.concat(cur);
}, []);
console.log(numArrNew);

TS 之 reduce的更多相关文章

  1. Hive优化策略

    hive优化目标 在有限的资源下,运行效率高. 常见问题 数据倾斜.Map数设置.Reduce数设置等 hive运行 查看运行计划 explain [extended] hql 例子 explain ...

  2. MapReduce剖析笔记之五:Map与Reduce任务分配过程

    在上一节分析了TaskTracker和JobTracker之间通过周期的心跳消息获取任务分配结果的过程.中间留了一个问题,就是任务到底是怎么分配的.任务的分配自然是由JobTracker做出来的,具体 ...

  3. hive语句嵌入python脚本(进行map和reduce,实现左外连接)

    在Hive语句中使用脚本(如python和shell)进行map和reduce:利用命令transform(或者指定map和reduce),配合加入的脚本文件add file 请看:http://ww ...

  4. vue + ts Vuex篇

    Vuex对Typescript的支持,仍十分薄弱,官方库只是添加了一些.d.ts声明文件,并没有像vue 2.5这样内置支持. 第三方衍生库 vuex-typescript, vuex-ts-deco ...

  5. JS/TS 对数组中的对象按对象的值进行去重

    举个例子:对以下数组按 lastName 的值进行去重 let listData = [ { firstName: "Rick", lastName: "Sanchez& ...

  6. Vue3.x+element-plus+ts踩坑笔记

    闲聊 前段时间小颖在B站找了个学习vue3+TS的视频,自己尝试着搭建了一些基础代码,在实现功能的过程中遇到了一些问题,为了防止自己遗忘,写个随笔记录一下嘻嘻 项目代码 git地址:vue3.x-ts ...

  7. 用 vue3 中的 reduce(累加器) 随机生成100个字母,放入数组中,统计每个字母出现的次数

    一.首先不用 reduce() 来实现  代码如下: <template lang=""> <div> <h1>统计每个字母出现的次数,不使用r ...

  8. JS的内建函数reduce

    @(js) reduce函数,是ECMAScript5规范中出现的数组方法.在平时的工作中,相信大家使用的场景并不多,一般而言,可以通过reduce方法实现的逻辑都可以通过forEach方法来变相的实 ...

  9. MapReduce剖析笔记之七:Child子进程处理Map和Reduce任务的主要流程

    在上一节我们分析了TaskTracker如何对JobTracker分配过来的任务进行初始化,并创建各类JVM启动所需的信息,最终创建JVM的整个过程,本节我们继续来看,JVM启动后,执行的是Child ...

  10. MapReduce剖析笔记之三:Job的Map/Reduce Task初始化

    上一节分析了Job由JobClient提交到JobTracker的流程,利用RPC机制,JobTracker接收到Job ID和Job所在HDFS的目录,够早了JobInProgress对象,丢入队列 ...

随机推荐

  1. 前端JavaScript深拷贝的三种方法,看了不后悔!!!

    深拷⻉ 深拷⻉开辟⼀个新的栈,两个对象属完成相同,但是对应两个不同的地址,修改⼀个对象的属性,不会 改变另⼀个对象的属性 常⻅的深拷⻉⽅式有: _.cloneDeep() jQuery.extend( ...

  2. 2022-02-17 Python学习笔记

    2022-02-17 22:51:30 由于中文注释会导致报错,所以文件开头要加一行注释 #coding:utf-8 file = open('文件路径路径',w)#w表示没有就创建文件,有就打开 查 ...

  3. SAP MD04屏幕显示增强

    需求 在看物料MRP结果的时候,业务人员想要看到工单批次,工单批次是我们这边工单下达后传输到其他系统,然后由其他系统回传回来的. 开发步骤 主要使用二代增强出口:M61X0002 创建增强项目 事务码 ...

  4. JSON字符串需Aes加密,加密为Hex

    JSON字符串需Aes加密,加密为Hex 前端加密 后端加密 package com.iktapp.api.utils; import org.apache.commons.codec.Decoder ...

  5. Aspose.Cells 拒绝访问、数据库 64 bit mode with the 32 bit Oracle、视图加载格式不正确。

    第一次遇到发布程序后,引发的这么多奇葩问题.记录一下. 配置:windows server 2018 R2 企业版 sp1 这是一台闲置4年机子,拿到机子里面已经安装过oracle客户端,我直接卸载装 ...

  6. hostPath类型的卷挂载

    卷类型之hostPath hostPath类型的卷可以把宿主机节点上的文件或文件夹挂载到pod中 先来看看hostPath类型的卷如何配置: apiVersion: v1 kind: Pod meta ...

  7. spring 理念与项目构建

    spring理念: 使现有的技术更容易使用,其本身是一个大杂烩,整合了现有的技术框架. ssh: struct2 spring hibernate ssm :springmvc spring myba ...

  8. django的模版

    django的模版 1模版语法  views.py 书写方式 def index(request): ''' 模版语法分: 变量: {{ }} 1. 深度查询 句点符 2. 过滤器 {{val|fil ...

  9. 【SSO单点系列】(4):CAS4.0 之非Ajax-iframe 登录

    一.描述 不使用Ajax-iframe 登录 仍然要自定义页面 二.思路: 将数据提交给服务器登录页面,服务登录页面自动提交. 三.实现 1.客户端 <form name="login ...

  10. RabbitMQ管理界面使用之手动送数据

    目录 1. 找到相应的队列, 点击进入详情 2. 找到Publish Message项,填写自定义数据 3. 发送数据 4. 发送成功 5. 接收 1. 找到相应的队列, 点击进入详情 2. 找到Pu ...