关于Array.reduce的理解与拓展
2018年1月6日
首先我要感谢我的同事徒步上山看日出在我第一份实习的时候对我的指导,现在我也开始跟他一样开始养成写博客的习惯
现在开始讨论我遇到的第一个问题,这是我在看javascript高级程序设计看的一个令像我这样的新手值得思考的问题
文章思路
- 什么是array的reduce,用法?
- 什么是迭代==>(在学校学的被狗吃了系列~)
关于Array.ruduce( )
书中是这么写的
ECMAScript 5 还新增了两个归并数组的方法: reduce()和 reduceRight()。这两个方法都会迭代数组的所有项,然后构建一个最终返回的值。其中, reduce()方法从数组的第一项开始,逐个遍历到最后。而 reduceRight()则从数组的最后一项开始,向前遍历到第一项。
这两个方法都接收两个参数:一个在每一项上调用的函数和(可选的)作为归并基础的初始值。传给 reduce()和 reduceRight()的函数接收 4 个参数:前一个值、当前值、项的索引和数组对象。
这个函数返回的任何值都会作为第一个参数自动传给下一项。第一次迭代发生在数组的第二项上,因此第一个参数是数组的第一项,第二个参数就是数组的第二项。
使用 reduce()方法可以执行求数组中所有值之和的操作,比如:
var values = [1,2,3,4,5];
var sum = values.reduce(function(prev, cur, index, array){
return prev + cur;
});
alert(sum);
第一次执行回调函数, prev 是 1, cur 是 2。第二次, prev 是 3(1 加 2 的结果), cur 是 3(数组的第三项)。这个过程会持续到把数组中的每一项都访问一遍,最后返回结果。
我的理解
数组values有5项,所以数组要执行4次运算
- (1+2) => 3
- (3+3) => 6
- (6+4) => 10
- (10+5) => 15
那如何证明呢,下面我自己写的demo
let arr=[1,2,3,4,5]
let sum = arr.reduce((prev,cur,index,array)=>{
console.log("执行了第",index,"次cur的值是",cur,"prev的值是",prev)
//原来console.log这样可以用
return prev+cur
})
console.log(sum)
结果是
执行了第 1 次cur的值是 2 prev的值是 1<br/>
执行了第 2 次cur的值是 3 prev的值是 3<br/>
执行了第 3 次cur的值是 4 prev的值是 6<br/>
执行了第 4 次cur的值是 5 prev的值是 10<br/>
15
===>猜想get!!!
===>不过如果用迭代可以怎么做
什么是迭代(才发现数据结构这种东西真的很重要啊,哪里都能用到,js也是!!!)
关于迭代(我去百度一波....)
定义:一个函数直接或间接调用自己
迭代需要满足的三个条件:
- 必须有一个明确的中止条件
- 该函数所处理的数据规模必须在递减
- 这个转化必须是可解的
int sum(int n )
{
if(n==1) return 1;
else return n+sum(n-1);
}
同样是求0~n的和,这段代码是每次在函数体中调用自身函数,1~n的和可以拆分成两个部分,1~n-1的和加上n,因此,递归的思想就是:在函数或子过程的内部,直接或者间接地调用自己的算法,从而把问题转化为规模缩小了的同类问题的子问题<br/>
递归算法的步骤:
- 确定递归公式,如sum(n) = sum(n-1)+n
- 确定递归结束条件,如n=1结束递归
刚才的函数
let arr=[1,2,3,4,5]
let sum = arr.reduce((prev,cur,index,array)=>{
console.log("执行了第",index,"次cur的值是",cur,"prev的值是",prev)
//原来console.log这样可以用
return prev+cur
})
console.log(sum)
就可以理解为
function add(n){
if(n==1){
return 1
}
return add(n-1)+n
}
console.log(add(5));
当第一次执行的时候函数add(n)碰到add(n-1)的时候就会进入这个函数执行add(n-1),[在这里,我们注意到add(1)=1(就是说递归终止)]之后又遇到add(n-1-1),当n=2时 =>
add(2){
add(2-1)+2 => add(1)+2 => 1+2
}
由此可推
add(3){
add(2)+3 =>1+2+3
}
add(4){
add(3)+4 =>1+2+3+4
}
add(5){
add(4)+5 => 1+2+3+4+5
}
so,这次博客写完了,谢谢大家阅读,求点赞求人气哈哈~~
关于Array.reduce的理解与拓展的更多相关文章
- Array.prototype.reduce 的理解与实现
Array.prototype.reduce 是 JavaScript 中比较实用的一个函数,但是很多人都没有使用过它,因为 reduce 能做的事情其实 forEach 或者 map 函数也能做,而 ...
- 数组中的reduce 函数理解
第一次见到reduce 是在js 的高级程序设计中,它的意思是把一个数组减少为一个数,举的例子是数组中元素的求和.它接受一个函数作为参数,函数又有两个参数,一个是prev, 前一个值,一个是next, ...
- Array.reduce()方法的使用
起因是学习异步函数的串行与并行写法时,发现reduce方法可以简化写法,然后看到一篇博客里面这样一段代码: var array = [1, [2, [3, 4], 5], 6]; function f ...
- reduce深入理解
// map console.log([1, 2, 3, 4, 5].reduce((a, v) => { a.push(v * v); return a },[])); //filter co ...
- Array.reduce()方法
Array.reduce()方法是对数组的遍历,返回一个单个返回值 使用方法: Array.reduce((acc, cur, idx, src) => { }, initialValue) ...
- 自从学会了 Array.reduce() ,再也离不开它
(转载)原文链接:https://juejin.im/post/5dfd9d27e51d455825129ec3 在所有后 ES6 时代的数组方法中,我觉得最难理解的就是Array.reduce( ...
- 用es6的Array.reduce()方法计算一个字符串中每个字符出现的次数
有一道经典的字符串处理的问题,统计一个字符串中每个字符出现的次数. 用es6的Array.reduce()函数配合“...”扩展符号可以更方便的处理该问题. s='abananbaacnncn' [. ...
- Array.reduce()学习
昨天遇到的一道题:1234567890 => 1,234,567,890 要求其实就是使用逗号做千分位将数字进行分隔. 当时没想到任何方法,但是以前看到过,印象很深刻,今天就找了一下. 看到其实 ...
- JS Array.reduce 对象属性累加
Array reduce() 方法 ,无非就是 计算数组元素 相加后的总和 ,看网上给的Demo 全是 [1,2,3,4,6].reduce 这种基本用法, 本次我将使用 reduce 实现 数组 ...
随机推荐
- Vue生命周期及业务场景使用
vue里的生命周期是什么? vue实例从创建到销毁的过程称之为vue的生命周期 vue的生命周期各阶段都做了什么? beforeCreate 实例创建前:这个阶段实例的data.methods是读不到 ...
- 【原创】大叔经验分享(57)hue启动coordinator时报错
hue启动coordinator时报错,页面返回undefinied错误框: 后台日志报错: runcpserver.log [13/May/2019 04:34:55 -0700] middlewa ...
- ES6入门五:箭头函数、函数与ES6新语法
箭头函数的基本用法与特点 函数与ES6新语法 一.箭头函数的基本用法与特点 声明箭头函数采用声明变量和常量的关键字:var.let.const 箭头函数的参数:没有参数用"()"空 ...
- 基于JWT的token身份认证方案(转)
https://www.cnblogs.com/xiangkejin/archive/2018/05/08/9011119.html 一.使用JSON Web Token的好处? 1.性能问题. JW ...
- How to setup a native windows server 2003 tftpd
expand tftpd.ex_ %windir%\system32\tftpd.exe instsrv tftpd %windir%\system32\tftpd.exe reg add hklm\ ...
- D-Link系列路由器漏洞挖掘入门
D-Link系列路由器漏洞挖掘入门 前言 前几天去上海参加了geekpwn,看着大神们一个个破解成功各种硬件,我只能在下面喊 6666,特别羡慕那些大神们.所以回来就决定好好研究一下路由器,争取跟上大 ...
- 九,configMap及secret的基本使用
目录 制定容器配置的方式 configMap(存储数据为明文,敏感数据慎用) 创建configMap的几种方式 命令行创建和测试configMap实例 创建一个Pod 挂载测试 通过指定文件创建con ...
- 启动Activity的单独事件方法2
1.Button中创建android:onClick="sendmessage" sendmessage方法名 //MAIN_acitivity创建这个同名独立方法 响应Butto ...
- Linux----Ubuntu虚拟机(VMWare)学习
1.在安装虚拟机系统完成后,如果忘记密码则 https://jingyan.baidu.com/article/c843ea0b9e851077931e4aea.html 2.如何拖动桌面软件移动 长 ...
- Selenium(5)
一.WebDriver结合Junit的使用 1.Junit中常用的断言 (1)assertEquals:断言实际结果与预期结果是否相等 Equals:相等 格式:assertEquals(预期值,实际 ...