JavaScript -- arr.reduce()方法的理解与应用

简介

reduce()接受一个函数作为累加器，从数组第一个值开始缩减，直到最后一个值缩减完成。最终计算为一个值
reduce()可做为高阶函数，用于函数的，compose
reduce()无法调用空数组，会报错。

语法:

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

arr.reduce (function ,initialValue)	function (total, currentValue, currentIndex, arr)
fun: 回调函数	total: 初始值initialValue，或fun的返回值
initialValue: 传递函数初始值	currentValue：当前值
.	currentIndex：当前我的索引
.	arr：要累加的arr非空数组

要注意的是当 initialValue 的值为空的，也就是没有初始值时，函数第一次累加的 total 将会是 arr 的第一个元素，currentindex 的值为 1,

简单例子：

Exp1

累加应用

let arr2 = [1,2,3,4,5,6,7,8,9,10]
let allsum = arr2.reduce((sum,currentValue)=>{return sum += currentValue
},100)
console.log(allsum)//155

Exp2

将string1分割为数组[a,b,c,d]，用reduce拼接到newStr中，得到的结果 0abcd；

let string = 'a-b-c-d'
let arr = string.split('-')//[a,b,c,d]
let newStr = '0'function getString(all, currentValue, currentIndex, arr) { console.log(all, currentValue, currentIndex)return all += currentValue
}
let value = arr.reduce(getString,newStr)
console.log(value) // 0abcd

getString部分运行结果： 被调用四次
0 a 0
0a b 1
0ab c 2
0abc d 3最终value打印：
0abcd

要注意的是，如果没有初始值 newStr，运行结果如

getString部分运行结果：  被调用三次
a b 1 //第一次循环将arr的第一个元素作为初始值，当前索引为1
ab c 2
abc d 3最终value打印：
abcd

JavaScript -- arr.reduce()方法的理解与应用相关推荐

javascript中reduce的用法
文章目录一.reduce基本语法二.reduce常用场景 1. 求和 2. 数据拼接三.实际项目中使用示例 1. 模拟Redux中的compose方法 1.1. 简单写法 1.2 利用reduc ...
JavaScript 中数组方法 reduce 的妙用之处
Javascript数组方法中,相比map.filter.forEach等常用的迭代方法,reduce常常被我们所忽略,今天一起来探究一下reduce在我们实战开发当中,能有哪些妙用之处,下面从red ...
JavaScript数组归并方法reduce
示例代码: <!DOCTYPE html> <html lang="zh"><head><meta charset="UTF-8 ...
javascript学习系列(5):数组中的reduce方法
最好的种树是十年前,其次是现在.歌谣每天一个前端小知识提醒你改好好学习了知乎博主 csdn博主 b站博主放弃很容易但是坚持一定很酷我是歌谣喜欢就一键三连咯你得点赞是对歌谣最大的 ...
【JavaScript】查漏补缺 —数组中reduce()方法
[JavaScript]查漏补缺 -数组中reduce()方法
提升代码格调——JavaScript 数组的 reduce() 方法入门
基本概念 reduce() 方法为数组中的每一个元素依次执行回调函数(不包括数组中被删除或从未被赋值的元素),返回一个具体的结果. 语法 reduce() 接收两个参数,其基本语法为: arr.red ...
reduce 方法 (Array) (JavaScript)
概念: 对数组中的所有元素调用指定的回调函数.该回调函数的返回值为累积结果,并且此返回值在下一次调用该回调函数时作为参数提供. 语法: array1.reduce(callbackfn[, initi ...
这是如何更好地利用JavaScript数组的方法
by pacdiv 由pacdiv 这是如何更好地利用JavaScript数组的方法 (Here's how you can make better use of JavaScript arrays) ...
详解数组中的reduce方法
前言这几天面试被问到了数组的方法有哪些,回答得简直一塌糊涂,面试官说reduce的功能很强大,于是想对这个方法进行总结,在红宝书中对这个方法的描述并不算多,我也是参考了其他文章才进行总结的,下面就开 ...

JavaScript -- arr.reduce()方法的理解与应用

简介

语法:

简单例子：

JavaScript -- arr.reduce()方法的理解与应用相关推荐

最新文章

热门文章