js 使用 reduce 实现将 一维数组 转 二维数组 javascript 可指定数量

使用场景：
在进行业务开发时，遇到表单需要分行渲染，也就是每四个数据对象渲染为一行，此时后端返回的数据格式是[{ id: 1 }, { id: 2 }, { id: 3 }],
需要将后端这个数据进行处理,以符合渲染表单时每行放四个字段，实现思路：按每4个数据对象存储为一个数组中，然后将全部数组放到一个大的数组中，如： [ [{ id: 1 }, { id: 2 }], [ { id: 3 }, { id: 4 } ] ] 这很适合使用 ES6 的 reduce 数组方法进行处理，reduce是对数组中每个值进行处理并最终汇集到一个值中的方法，所以当遇到数组内的值需要进行聚合值的操作时就可以选取reduce来做处理。

前置知识：
数组方法 reduce 的使用，附上文档： https://developer.mozilla.org/zh-cn/docs/Web/JavaScript/Reference/Global_Objects/Array/Reduce

将传入的一维数组按指定数量分割为二维数组。

参数：
source： 要分割的一维数组
num： 几个为一个数组的数量

浅拷贝示例

function oneTransTwo(source, num) {
      return source.reduce((v, item, index) => {
        let r = null;
        if (index % num === 0) {
          r = [...v, [item]];
        } else {
          v[v.length - 1].push(item);
          r = v;
        }
        return r;
      }, []);
};

注意：浅拷贝例子，修改返回数组中对象的值会影响 source 原数组的值

深拷贝示例

function oneTransTwo(source, num) {
      return source.reduce((v, item, index) => {
        let r = null;
        if (index % num === 0) {
          r = [...v, [JSON.parse(JSON.stringify(item))]];
        } else {
          v[v.length - 1].push(item);
          r = v;
        }
        return r;
      }, []);
};

示例：

使用方式：oneTransTwo([{id: 1}, {id: 2}], 1)

效果：