lodash函数库 -- chunk

loadsh函数库中的 chunk 函数采用 typescript 语法重写.

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

/**
 *
 * 将数组(array)拆分成多个 size 长度的区块,并将这些区块组成一个新数组。
 * 如果array 无法被分割成全部等长的区块,那么最后剩余的元素将组成一个区块。
 *
 * @param array 需要处理的数组
 * @param size 每个数组区块的长度
 * @returns {Array<Array<T>>}
 * @example
 *
 * chunk(['a', 'b', 'c'], 2)
 * // => [['a', 'b'], ['c']]
 *
 * chunk(['a', 'b', 'c','d'], 2)
 * // => [['a', 'b'], ['c','d']]
 */
const chunk = <T>(array: Array<T>, size = 1): Array<Array<T>> => {
// 边界检测
// 需要考虑块长度小于1和空数组
const length = array.length;
if (!length || size < 1) return [];

let index = 0; // 处理数组起始位
let resindex = 0; // 新数组起始位
const result = new Array<Array<T>>(Math.ceil(length / size));
while (index < length) {
result[resindex++] = array.slice(index, (index += size)); // size 为步长值
}
return result;
};

export default chunk;
import chunk from "../src/chunk";

const arr = [1, 2, 3, 4, 5, 6];
const n = chunk(arr, 3);
console.log(n); // [ [ 1, 2, 3 ], [ 4, 5, 6 ] ]

const arrs = ["a", "b", "c"];
const n1 = chunk(arrs, 2);
console.log(n1); // [ [ 'a', 'b' ], [ 'c' ] ]

const arre = [] as Array<string>;
const n2 = chunk(arre, 2);
console.log(n2); // []
(0)

相关推荐

  • 前端面试题整理——手写bind函数

    var arr = [1,2,3,4,5] console.log(arr.slice(1,4)) console.log(arr) Function.prototype.bind1 = functi ...

  • 什么情况下会使用array.reduce函数

    当业务需要从一个数组里求出某项的和的时候. 1.for遍历 var a = [1,2,3,4,5,6,7,8,9,10] var resulte = 0; for (let index = 0; in ...

  • 9个实用的JavaScript开发技巧,你必须知道一下

    WEB前端开发社区 昨天 从Web开发到机器学习再到应用程序开发,JavaScript拥有大量的应用程序列表. 幸运的是,JavaScript提供了可以方便使用的全面功能列表,但是,其中许多功能和ha ...

  • js数组方法(管饱)

    有一些数组方法是ECMAScript新增的,一定要注意浏览器的兼容!!Array对象属性:属性说明constructor返回对创建此对象的函数引用length返回集合内的元素的所有长度prototyp ...

  • lodash函数库 -- drop函数

    drop 函数 drop函数功能:按顺序删除数组元素,当n为正数时,从左删除n个元素;当n为负数时,从右删除n个元素.;当n为0时,创建一个副本. drop返回值:返回一个新的数组. /** * 创建 ...

  • js 高阶函数reduce ——数组取交集、并集

    两个数组取交集 vs 多个数组取交集 => js reduce函数的妙用 1.reduce函数的用法及取数组交集 <script> // 值集数组 let arr1 = [1,2] ...

  • ES6新增数组的方法

    es6新增数组操作方法 在我们拿到后端数据的时候,可能会对数据进行一些筛选.过滤,传统的做法如下 // 取出数组中name为kele的数组集合 let a = [ { name: 'kele', ti ...

  • 20个对JavaScript 开发人员的超级有用的技巧

    2021-09-07 JavaScript 是流行编程语言之一,也是许多开发人员最喜欢的语言之一.你可以用它构建 Web 或移动混合应用程序,甚至是机器人开发学习.该语言对于初学者来说,也不是那么困难 ...

  • 诚之和:代码整洁之道的方法有哪些

    这篇文章主要讲解了"代码整洁之道的方法有哪些",文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习"代码整洁之道的方法有哪些&qu ...

  • javascript 数组 对象的一些方法记录

    记录一下常用的数组和对象的一些方法 数组 push() 数组后添加元素 // 作用:把一个元素或多个元素,从数组后面添加到数组里面: // 参数:添加的数据 // 返回:添加后的数组的长度: let ...

  • PHP中的数组分页实现(非数据库)

    PHP中的数组分页实现(非数据库) 在日常开发的业务环境中,我们一般都会使用 MySQL 语句来实现分页的功能.但是,往往也有些数据并不多,或者只是获取 PHP 中定义的一些数组数据时需要分页的功能. ...

  • 17个你可能还不知道 JS 技巧

    17个你可能还不知道 JS 技巧 原创前端小智2020-12-14 08:38:20 本文已经过原作者 Rahul 授权翻译! 1.三元运算符 新手 let hungry = true;let eat ...