一.函数介绍

  • 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. FICO开发

    一.增强 1.FBL5N / 客户供应商行项目 对于客户供应商行项目报表展示增强字段: 方法① badi: FI_ITEMS_CH_DATA   更改输出内表数据即可 方法② BTE: 详见 http ...

  2. 零基础小白速成python?有了这本书你还在担心什么?

    <Python编程快速上手>书籍PDF高清版免费下载地址 提取码:bc9h 内容简介  · · · · · · 如今,人们面临的大多数任务都可以通过编写计算机软件来完成.Python是一种 ...

  3. 从零开始升级基于RuleBased的聊天机器人

    这里记录从最基础的基于规则的聊天机器人,升级到基于逻辑的机器人,再升级到调用Google提供的API来让机器人能说.会听普通话. 最基本的完全基于规则式的问答:问什么就答什么,幼儿园水平. impor ...

  4. C#得到和JAVA通过Base64.encodeBase64String(DigestUtils.md5(""))加密后的字符串

    public static string GetMd5(string Str) { MD5 md5Hash = MD5.Create(); // 将输入字符串转换为字节数组并计算哈希数据 byte[] ...

  5. DEPRECATION WARNING: Using / for division is deprecated and will be removed in Dart Sass 2.0.0

    DEPRECATION WARNING: Using / for division is deprecated and will be removed in Dart Sass 2.0.0. 问题解决 ...

  6. .net core 3.1项目运行在Windows server 2012R2服务器上,Decimal类型小数点不见了,求解!32112.7958

    .net core 3.1项目运行在Windows server 2012R2服务器上,Decimal类型小数点不见了,求解! string str = "1002910.8241" ...

  7. 查电脑并修改IP地址,你晓得吗?

    查电脑并修改IP地址,你晓得吗?   好记性不如烂笔头,古人的话,浅显却好有深意,越品越有味道.   每次都会忘记怎么查电脑IP,那么今天就写下来吧! 方法一:通过命令行查询IP地址   快捷键Win ...

  8. QtQuick与Qml介绍

    文章纲要: 1.QtQuick是什么 2.qml与QtQuick关系 一.QtQuick是什么 "quick--快速创建应用程序" "quick--Qt User Int ...

  9. PaaS和SaaS的区别是什么?

    PaaS是Platform-as-a-Service的缩写,意思是"平台即服务" SaaS是Software-as-a-Service的缩写,意思是"软件即服务" ...

  10. 【QT+MSVC2015】不安装VS2015,QT配置MSVC2015编译环境

    本文介绍不安装VS2015的情况下在QT5.10中配置MSVC2015编译器. 系统:windows系统 QT版本:5.10.1 所需文件: QT安装程序--qt-opensource-windows ...