lodash里的reduce

loostudy 发布于2019-08-23 16:51 / 2737人阅读

摘要：前言对于，可能之前对于他的用法只是用于累加，但其实他的真正用途适用于作为一个高阶函数，用于实现函数式编程里的的个人理解创建一个函数，最少接收两个参数，一个函数数组，一个初始参数，依次执行函数数组，下一个函数的第一个参数是上一个的结果，初始参

前言

对于reduce，可能之前对于他的用法只是用于累加，但其实他的真正用途适用于作为一个高阶函数，用于实现函数式编程里的 compose

compose的个人理解

创建一个函数，最少接收两个参数，一个函数数组，一个初始参数，依次执行函数数组，下一个函数的第一个参数是上一个的结果，初始参数是第一个函数的第一个参数。

lodash实现 reduce


function reduce(collection, iteratee, accumulator) {
  const func = Array.isArray(collection) ? arrayReduce : baseReduce
  const initAccum = arguments.length < 3
  
  return func(collection, iteratee, accumulator, initAccum, baseEach)
}

arrayReduce

function arrayReduce(array, iteratee, accumulator, initAccum) {
  let index = -1
  const length = array == null ? 0 : array.length

  if (initAccum && length) {
    accumulator = array[++index]
  }
  //  当initAccum为true时，从下标为1的开始运行
  while (++index < length) {
    accumulator = iteratee(accumulator, array[index], index, array)
  }
  return accumulator
}

baseReduce


function baseReduce(collection, iteratee, accumulator, initAccum, eachFunc) {
  eachFunc(collection, (value, index, collection) => {
    accumulator = initAccum
      ? (initAccum = false, value)
      : iteratee(accumulator, value, index, collection)
  })
  return accumulator
}

baseEach


function baseEach(collection, iteratee) {
  if (collection == null) {
    return collection
  }
  
  if (!isArrayLike(collection)) {
    
    return baseForOwn(collection, iteratee)
  }
  const length = collection.length
  const iterable = Object(collection)
  let index = -1

  while (++index < length) {
    
    if (iteratee(iterable[index], index, iterable) === false) {
      break
    }
  }
  return collection
}

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

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

史上最全的 Redux 源码分析

摘要：订阅器不应该关注所有的变化，在订阅器被调用之前，往往由于嵌套的导致发生多次的改变，我们应该保证所有的监听都注册在之前。前言用 React + Redux 已经一段时间了，记得刚开始用Redux 的时候感觉非常绕，总搞不起里面的关系，如果大家用一段时间Redux又看了它的源码话，对你的理解会有很大的帮助。看完后，在回来看Redux，有一种柳暗花明又一村的感觉，. 源码我分析的...

fai1017 2019-08-21 14:53 评论0 收藏0
Lodash 源码分析（二）“Function” Methods

摘要：众所周知，函数能够将一个集合进行折叠。我们看到源代码是这样的在官方的注释中说，对于对象，遍历顺序是无法保证的。我在阅读源代码的过程中也会遇到很多不理解的地方。待续下周将继续更新源码分析系列，接下来将会分析集合方法。前言这是Lodash源码分析的第二篇文章，我们在第一篇Lodash 源码分析（一）Function Methods中介绍了基本的_.after，_.map，以及复杂的_....

cheukyin 2019-08-20 19:00 评论0 收藏0
你并不需要Underscore/Lodash

摘要：将某个列表中的元素映射到新的列表中。判断序列中是否存在元素满足给定方程的条件。用来查找数组中某指定元素的索引如果找不到指定的元素则返回返回指定值在字符串对象中首次出现的位置。创建一个在经过了指定计数器之后才会被调用的方程。 You dont (may not) need Lodash/Underscore Lodash 和 Underscore 是非常优秀的当代JavaScript的工...

Mr_houzi 2019-08-19 17:37 评论0 收藏0
JavaScript 数组分组的实现

摘要：今天回答了的问题生产嵌套数组也就是对数组分组更好的写法。实现像这种，目标数组长度和原数组长度不一致的情况，函数式写法很容易想到函数。小结数组分组是一个很简单的问题，有很多种方法来处理。今天回答了 @_bleach 的问题：JS生产嵌套数组（也就是对数组分组）更好的写法。回答的过程中对 lodash _.chunk() 产生了好奇，所以分析了一下它的源码，再加上我自己的解决方案，收集...

Coly 2019-08-20 12:14 评论0 收藏0
【腾讯Bugly干货分享】React 移动 web 极致优化

摘要：数据管理及性能优化统一管理数据这一部份算是重头戏吧。重复渲染导致卡顿这套的东西在家校群页面上用得很欢乐，以至于不用怎么写都没遇到过什么性能问题。但放到移动端上，我们在列表页重构的时候就马上遇到卡顿的问题了。列表页目前的处理办法是将值换成。本文来自于腾讯bugly开发者社区，非经作者同意，请勿转载，原文地址：http://dev.qq.com/topic/57908... 最近一个季度...

suosuopuo 2019-08-21 10:54 评论0 收藏0