美文网首页
Lodash源码解析-_.chunk

Lodash源码解析-_.chunk

作者: 小妍妍说 | 来源:发表于2021-06-29 11:53 被阅读0次
_.chunk(array, [size=1])

将数组(array)拆分成多个 size 长度的区块,并将这些区块组成一个新数组。 如果array 无法被分割成全部等长的区块,那么最后剩余的元素将组成一个区块。size如果未填写,默认为1。

例子:

_.chunk(['a', 'b', 'c', 'd', 'e'], 2);
// => [['a', 'b'], ['c', 'd'], ['e']]

自己实现

function chunk(arr,num){
  if (num<1) return;
  var newarr=[];
  for(var i=0;i<arr.length/num;i++)
  {
    newarr.push(arr.slice(num*i,(i+1)*num))
  }
  return newarr;
}

_.chunk源码

import slice from './slice.js'
import toInteger from './toInteger.js'


function chunk(array, size = 1) {     //默认size为1
  size = Math.max(toInteger(size), 0)     //size若小于0,则取值0,否则取值为size
  const length = array == null ? 0 : array.length     //array为null,则取值为0,否则取值为array.length
  if (!length || size < 1) {     //length为0或者size小于1,则返回空数组
    return []
  }
  let index = 0
  let resIndex = 0
// 用数组的长度除以size并向上取整以得到分块的个数,新建一个长度为分块个数的数组result
  const result = new Array(Math.ceil(length / size))    


// while循环用来遍历array数组,每次截取array中的size个元素并将截取结果添加到result数组中
// slice函数用的是lodash自己封装的方法
  while (index < length) {
    result[resIndex++] = slice(array, index, (index += size))
  }
  return result
}

总结:自己实现的时候使用了数组的两个函数:push(),slice(),并且没有写默认参数值(size=1),lodash写的循环体更加简洁。

相关文章

  • Lodash源码解析-_.chunk

    将数组(array)拆分成多个 size 长度的区块,并将这些区块组成一个新数组。 如果array 无法被分割成全...

  • Lodash 源码阅读 —— chunk

    Lodash 源码阅读 —— chunk 这里我先给出源码: 下面是分片段来解读: 这一段代码的意思是说,如果传入...

  • lodash源码之chunk

    1、使用场景 _.chunk(array, [size=1])将数组(array)拆分成多个 size 长度的区块...

  • loadsh防抖节流源码解读

    debounce 源码解析 lodash debounce 用法 _.debounce(func, [wait=0...

  • Lodash源码解析 Part1:Array、Collectio

    Lodash源码解析 Part1:Array、Collection lodash究竟做了什么?封装封装可能会用到但...

  • lodash源码分析-- chunk函数实现

    _.chunk函数 我的实现 别人的实现 对比 1.我觉得这一次我的耗时应该比较少吧。哈哈哈哈哈,因为只循环了一遍...

  • lodash源码解析

    前言:虽然现在前端生态越来越丰富,三大框架鼎足而立,但是,原生的JS编码能力还是很重要的,所以决定学一下lodas...

  • Lodash

    Lodash-Array Array _.chunk按照一定的长度将数组均匀切割成 chunk,将切割后的 chu...

  • Lodash源码解析-_.compact

    创建一个新数组,包含原数组中所有的非假值元素。例如false, null,0, "", undefined, 和 ...

  • Lodash源码解析-_.flatten

    减少一级array嵌套深度。例子: 源码解析: => baseFlatten(): => isFlattenabl...

网友评论

      本文标题:Lodash源码解析-_.chunk

      本文链接:https://www.haomeiwen.com/subject/faihultx.html