JavaScript数组遍历方法4 reduce方法

最新推荐文章于 2024-06-29 12:32:00 发布
最新推荐文章于 2024-06-29 12:32:00 发布
阅读量739 收藏
点赞数
分类专栏： 前端综合 文章标签： javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/jifukui/article/details/108277635
版权
本文介绍了JavaScript数组的reduce方法，该方法用于遍历数组并进行累积操作。回调函数接受4个参数，包括传入值、当前值、索引和整个数组。reduce不强制返回数组，适用于求和、查找特定值、找最大值或最小值等场景。
摘要由CSDN通过智能技术生成

数组的reduce方法也是数组进行遍历的方法，其也接收两个参数；第一个参数是一个回调函数，第二个参数是一个传入值。其中第一个参数回调函数可以接收4个参数第一个参数为传入值，第二个参数为当前值，第三个参数为当前在数组中的索引值，第四个参数为当前数组，其中第一个和第二个参数为必要参数其他参数为可选参数，reduce函数和map函数一样需要有一个返回值，但是与map函数不同的是reduce函数的返回值不必强制为数组。同map函数一样reduce函数中的回调函数也不能存在break和continue语句。下面是使用reduce函数进行数组求和的程序。

<!DOCTYPE html>
<html>
    <head>
        <title>数组的reduce方法</title>
        <meta charset="utf-8">
    </head>
    <body>
        <div id="value" style="width: 240px;height: 400;"></div>
    </body>
    <script>
        let dom = document.getElementById("value");
        let a = [1,2,3,4,5,6,7,8,9];
        let data = 0;
        let data1 = 0 ;
        let str = [];
        let data2 = 0;
        data2 = a.reduce((data,val,index)=>{
            data1 += val
最低0.47元/天 解锁文章
jifukui
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
数组遍历forEach、map、filter、find、some、every、reduce等区别
卡卡西：一个擅长拷贝的前端程序员
04-09 2918
forEach() map()----更新数组 filter()、includes()、find()、findIndex()----筛选（删除）数组 some()、every()----判断数组 reduce()----叠加数组 arr.forEach() 遍历数组全部元素，利用回调函数对数组进行操作，自动遍历数组.length次，且无法break中途跳出循环，不可控 不支持retur...
数组的遍历-reduce
xiaoma19941027的博客
07-15 279
普通数组的求和 var arr=[1,2,3,4,5] var arrTemp=arr.reduce((a,b)=>{ return a+b },0) console.log(arrTemp,'arrTemp') //15 数组中的对象的求和： var arr=[ { name:'小明', age:3 }, { name:'小红', age:5 }, { name:'小粉', age:12 }, { name:'小绿'
reduce函数高级用法
最新发布
lbking666666的专栏
06-29 1164
reduce()函数是 ECMAScript 6 (ES6) 中数组的一个迭代方法，它接收一个回调函数作为累加器（accumulator），对该数组的所有元素（从左到右）执行操作，最后将计算结果累积为单一输出值。：上一次回调函数的返回值，第一次调用回调函数时，如果指定的初始值 initialValue，那么该参数值就是 initialValue，否则就是数组元素的第一个。：数组中正在处理的元素。将需要去重处理的数组中的第1项在初始化数组中查找，如果找不到（空数组中肯定找不到），就将该项添加到初始化数组中；
ES6, JS中的各种数组遍历方法(如filter,map,reduce)
weixin_44798798的博客
09-27 684
ES6, JS中的各种数组遍历方法大总结 (find,findIndex,filter,map,reduce,for in,for of) 代码如下: //find和findIndex方法 var a = [1,2,3,4] var b = a.find(function(item){ //最后返回第一个大于0的数值 return item>2 }) var c = a.findIndex(function(item){ return item==3 //最后返回第一
reduce() 遍历数组
强者惜字如金，弱者废话连篇！
05-26 468
reduce() 遍历数组, 返回参数函数里的返回值.一般作为累加器计算总价 let arr = [1, 2, 3, 4]; // 情况1 // firstItem表示第一个参数，item表是除参数1之外剩余的参数 const arr1 = arr.reduce((firstItem, item) => { return firstItem += item; }) console.log(arr1); //10 // 情况2 // firstItem表示一个函数，默认值设置为0
Array.reduce方法：数组元素遍历
weixin_63559122的博客
03-27 505
reduce依次为数组的每个元素执行回调函数。说明： callback 依次为数组元素执行的回调函数 previousValue 上一次回调函数的返回值，或是提供的初始值 currentValue 当前被处理的元素 index 被处理元素的索引 array 要处理的数组 initialValue 初始值，如果不设置那么初始值就是数组的第一个元素例一：在上面例子中，未设置初始值，reduce将数组的第一个元素当作初
总结的一些代码常用的数组遍历方法案例
09-23
虽然这不是真正的数组，但可以转换为数组后使用上述的JavaScript数组方法。 ```javascript let elements = document.querySelectorAll('.myClass'); Array.from(elements).forEach(element => { // 操作每个...
JavaScript 数组遍历方法的对比
阿星君
06-10 781
JavaScript 数组遍历方法的对比 原文首发至fe2x.cc转载请标注原作者和附带原文连接 前言 JavaScript 发展至今已经发展出多种数组的循环遍历的方法,不同的遍历方法运行起来那个比较快,不同循环方法使用在那些场景,下面将进行比较: 各种数组遍历的方法 for语句 代码: var arr = [1,2,4,6] for(var i = 0, len = arr.length; i < len; i++){ console.log(arr[i]) }...
JS 数组遍历的方法
06-02
在JavaScript中，数组遍历是开发过程中不可或缺的一部分。它允许我们对数组中的每个元素执行操作，比如计算、筛选、转换等。本篇文章将详细介绍几种常见的JS数组遍历方法，并通过实例来加深理解。 1. `for`循环 这...
javascript数组遍历的几种常用方法性能分析对比
09-07
JavaScript数组遍历有多种常用方法，例如for循环、forEach方法、map方法、reduce方法等。我们可以通过性能分析对比它们的效率。 首先是for循环，它是最基本的遍历方式。通过使用索引来访问数组元素，可以在遍历过程...
数组遍历循环方法-reduce
weixin_43143715的博客
03-16 740
数组遍历方法reduce 在日常用到的数组遍历方法有forEach()、map()、filter()、reduce，这里单独说说reduce。
数组的遍历及归并方法简要总结 reduce() reduceRight() forEach() map() filter() every() some()等...
weixin_33825683的博客
04-03 188
数组是出现频率最高的数据结构之一, 而遍历是对数组做的最多的操作. 可以用来对进行遍历的函数有很多, 而且每个函数都有各自的适用情景, 要做根据不同的需求中选择最合理的函数, 必须先对这些函数各自的特点有所了解. 本文涉及的数组遍历相关的函数 首先将文中所讨论的所有方法列出, 以便有整体印象. 这些方法可以分为两种, 分别是: 数组的遍历方法, 共 7 个: forEach() map(...
数组之reduce()方法
xYY_X_xYY的博客
07-17 270
reduce()方法 1. 简介 reduce 方法是数组的归并方法，这个方法与迭代方法（forEach方法等）一样都会对数组进行遍历，不同的是reduce方法的回调函数中的第一个参数得到的是迭代结算后的结果。 2. 语法 reduce方法接收两个参数，如下： arr.reduce(callback(acl,val,idx,array),initVal) 第一个参数是要执行的函数，该函数中传入的参数 acl：上一次调用回调时返回的累积值 val：当前元素，必选项 idx：当前索引，可选项 arra
reduce用于遍历数组 迭代数组
qq_44917015的博客
12-22 368
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> <script&gt
JS数组reduce()方法详解及高级技巧
张miro
05-15 2937
JS数组reduce()方法详解及高级技巧 基本概念 我一直觉得一个知识点讲的太多容易误导大家，让人生怯 reduce() 网上reduce方法说的太复杂，其实掌握这些技能你的开发效率就能大大提升 简单应用 例1：叠加 var items = [10, 120, 1000]; var total = items.reduce((sumSoFar, item) => { return sum...
JavaScript数组reduce方法
Qiemo_的博客
05-05 690
1.reduce数组方法的作用 为每一个元素执行一次回调,并最终返回最后一次结果 2.语法:array.reduce( function ( total,item, index,arr) {} ,initialValue) function : 必须,数组中的每个元素都会执行这个函数 第一个参数:total,必须,初始值,或计算结束后的返回值 第二个参数: item,必须,当前元素的值 第三个参数 : index,可选,当前元素在数组中的索引值 ...
记录数组的reduce使用方法，并简单实现一个带分页表格的DOM
weixin_42931681的博客
06-19 338
前两天看一个视频聊天时才知道的reduce这个数组的方法，简单看了一下别人写的觉得使用这个方法渲染数据挺不错的，于是自己就写了一个小DOM玩玩。 先给大家简单说说数组的reduce这个方法： 来张图先 依上图，reduce方法中传递两个参数，第一个参数是一个方法，方法中又有四个参数：分别代表 1.初始值。（也就是这个方法一开始的返回值，和reduce方法的第二个参数有关系，我一般设为空） 2.当前元素，相当于遍历数组，拿到每一个下标的值 3.数组索引（就不多说啦） 4.当前这个数组（...
JS中数组的reduce方法使用总结
weixin_44370837的博客
08-10 1635
不知道大家有没有这种情况，每次要使用reduce方法时，总会想不起来这个方法该如何使用，都得先搜索一波reduce方法各个参数的含义与适用场景。 一、语法：数组中的每个元素执行该回调函数，最终返回一个结果值。 const arrMy = [1, 2, 3] arrMy.reduce(function(total, currentVal, currentIndex, arr){ // todo 每个函数元素要执行的 }, initVal) reduce的第一个参数：回调函数，必需，数组元素会执行
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值