关于Array.reduce的理解与拓展

李世赞发布于2019-08-29 14:10 / 1462人阅读

摘要：而则从数组的最后一项开始，向前遍历到第一项。传给和的函数接收个参数前一个值当前值项的索引和数组对象。这个函数返回的任何值都会作为第一个参数自动传给下一项。第二次，是加的结果，是数组的第三项。

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

执行了第 2 次cur的值是 3 prev的值是 3

执行了第 3 次cur的值是 4 prev的值是 6

执行了第 4 次cur的值是 5 prev的值是 10

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，因此，递归的思想就是：在函数或子过程的内部，直接或者间接地调用自己的算法，从而把问题转化为规模缩小了的同类问题的子问题

递归算法的步骤:

确定递归公式，如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,这次博客写完了,谢谢大家阅读,求点赞求人气哈哈~~

云服务器 idc机房托管关于云桌面与云服务器的问题关于云桌面与云服务器的问题吗深度学习与理解发展云服务器的拓展思路

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/112963.html

关于Array.reduce的理解与拓展

摘要：而则从数组的最后一项开始，向前遍历到第一项。传给和的函数接收个参数前一个值当前值项的索引和数组对象。这个函数返回的任何值都会作为第一个参数自动传给下一项。第二次，是加的结果，是数组的第三项。 2018年1月6日首先我要感谢我的同事徒步上山看日出在我第一份实习的时候对我的指导,现在我也开始跟他一样开始养成写博客的习惯现在开始讨论我遇到的第一个问题,这是我在看javascript高级程...

keithxiaoy 2019-08-01 18:20 评论0 收藏0
关于Array.reduce的理解与拓展

摘要：而则从数组的最后一项开始，向前遍历到第一项。传给和的函数接收个参数前一个值当前值项的索引和数组对象。这个函数返回的任何值都会作为第一个参数自动传给下一项。第二次，是加的结果，是数组的第三项。 2018年1月6日首先我要感谢我的同事徒步上山看日出在我第一份实习的时候对我的指导,现在我也开始跟他一样开始养成写博客的习惯现在开始讨论我遇到的第一个问题,这是我在看javascript高级程...

Karrdy 2019-08-21 18:40 评论0 收藏0
JavaScript数组迭代（遍历）方法

摘要：正文和中新增的的数组迭代方法如下其中，是新增的，其余都是新增的。指数组后，返回过滤后的新数组。它的参数跟方法是一样的所有数组成员依次执行回调函数，直到找出第一个返回值为的成员，然后返回该成员。前言 ES5和ES6中新增了不少东西，对于数组而言，新增了不少迭代方法，让我们可以抛弃for循环，更方便的写JS代码。正文 ES5和ES6中新增的的数组迭代方法如下： forEach map...

light 2019-08-20 17:34 评论0 收藏0
面试题目别有洞天 -> 从es6优雅解法，到降级polyfill，再到redux reduce

摘要：每次被执行时，和被传入，这个根据进行累加或者是自身消减，英文原意，进而返回最新的。之前的一篇文章：从一道面试题，到我可能看了假源码讨论了bind方法的各种进阶Pollyfill，今天再分享一个有意思的题目。从解这道题目出发，我会谈到数组的Reduce方法，ES6特性和Redux数据流框架中Reducer的命名等等。一道典型的题目，却如唐代诗人章碣《对月》诗中所云：别有洞天三十六，水...

econi 2019-08-21 11:33 评论0 收藏0
面试题目别有洞天 -> 从es6优雅解法，到降级polyfill，再到redux reduce

摘要：每次被执行时，和被传入，这个根据进行累加或者是自身消减，英文原意，进而返回最新的。之前的一篇文章：从一道面试题，到我可能看了假源码讨论了bind方法的各种进阶Pollyfill，今天再分享一个有意思的题目。从解这道题目出发，我会谈到数组的Reduce方法，ES6特性和Redux数据流框架中Reducer的命名等等。一道典型的题目，却如唐代诗人章碣《对月》诗中所云：别有洞天三十六，水...

beanlam 2019-08-05 10:53 评论0 收藏0