如何使用JS数组减少方法

  介绍

这篇文章主要讲解了如何使用JS数组减少方法,内容清晰明了,对此有兴趣的小伙伴可以学习一下,相信大家阅读完之后会有帮助。


一直以来都在函数式编程的大门之外徘徊,要入门的话首先得熟悉各种高阶函数,数组的减少方法就是其中之一。

减少方法将会对数组元素从左到右依次执行减速器函数,然后返回一个累计的值。举个形象的例子:你要组装一台电脑,买了主板、CPU、显卡,内存,硬盘,电源……这些零件是组装电脑的必要条件。

装的过程可以简单概括为拆掉每个零件的包装,再装到一起。类比一下减少函数就可以明白了,那些零件就相当于要执行减少方法的数组,对每个零件执行拆除包装的加工程序,就是对数组的每个元素执行减速器函数,把这些零件装到一起,就相当于减少方法的任务,最终组装好的电脑相当于减少方法的返回值。

减少方法接收两个参数,第一个参数是回调函数减速器,第二个参数是初始值.reducer函数接收四个参数:

    <李>蓄电池:MDN上解释为累计器,但我觉得不恰当的,按我的理解它应该是截至当前元素,之前所有的数组元素被减速器函数处理累计的结果李 <李>电流:当前被执行的数组元素 <李> CurrentIndex:当前被执行的数组元素索引 <李> SourceArray:原数组,也就是调用减少方法的数组

如果传入第二个参数,减少方法会在这个参数的基础上开始累计执行。

概念讲了那么多,那减少它的执行机制是怎样的呢?别着急,从用法入手一点一点分析。

来个最好理解的例子:数组求和

 const arr=(1、2、3、4)
  const蓄电池=(总、当前、currentIndex arr)=比;{
  控制台。日志(总、当前、currentIndex arr);
  返回总+当前
  }
  console.log (arr.reduce(蓄电池)

执行结果如下:

如何使用JS数组减少方法

很明确,最终的结果就是把所有数组的元素都加起来。值得注意的是,它将数组的第一个元素作为累加的初始值,然后再依次对后边的元素执行减速器函数。

总共执行了三次,得出最终结果。那如果传入初始值,是怎样的执行顺序?

console.log(加勒比海盗。减少(蓄电池、3)

结果如下:

如何使用JS数组减少方法

这次是以传入的初始值作为累加的起点,然后依次对数组的元素执行减速器。

假设对没有初始值的空数组调用减少方法,则会报错:

未捕获TypeError:减少空数组没有初始值

一些用法

讲了一些概念,但使用场景更重要,下面来看一下减少方法都会有哪些用途。

写函数

组合是函数式编程的一种形式,用于将多个函数合,并上一个函数的返回值作为当前函数的入参,当前函数的返回值再作为下一个函数的入参,这样的效果有点类似于高雅中间件的洋葱模型。

 (a, b, c, d)=比;a (b (c (d ()))) 

实际上和累加差不多,只不过把累加操作变成了入参执行,相加的结果变成了执行的返回值.redux的applyMiddleware内就使用了组成,目的是保证最终的调度是被所有中间件处理后的结果。

下面来以applyMiddleware中的创作为例,先看用法:

 const结果=组成(a, b, c) (params) 

执行情况是这样:

(params)=比;a (b (c (params)))

返回的是一个函数,将参数作为该函数的入参,被右侧第一个函数执行,执行顺序是从右到左执行,其余的函数的参数都是上一个函数的返回值。

看一下实现:

常量数组=[[0,1],[2、3],[4,5]]
  const平=arr=比;{
  加勒比海盗。减少((a, b)=比;{
  返回a.concat (b)
  }, [])
  }
  console.log(平(数组));//[0,1,2,3,4,5]

如何使用JS数组减少方法