一起养成写作习惯！这是我参与「掘金日新计划 · 4 月更文挑战」的第8天，点击查看活动详情。 今天工作的时候遇到一个一维数组转二数组的问题，后台返回的错误信息字符串（中间使用br标签）进行连接，由于量太大，需要每行显示两个错误信息。
使用场景举例：接口返回一个数组对象，展示时每行固定显示n个，则可将返回的数组转成二维数组[[...n], [...n]...]的形式循环展示。
分析：我们将一维数组，截取设定的长度，放入的一个新数组中。同时通过设定的长度，决定二维数组中的元素个数，但是一维数组的长度由总个数和设定的长度共同决定的。
知识点
Math.floor()方法返回小于等于x的最大整数。【向下取整】slice()方法可从已有的数组中返回一个新的数组，包含从 start 到 end （不包括该元素）的元素。
数组元素为基本类型
let baseArray = [1, 2, 3, 4, 5, 6, 7, 8];//我接口返回的字符串而已，形式差不多
let len = baseArray.length;
let n = 2; //假设每行显示2个
let lineNum = len % 2 === 0 ? len / 2 : Math.floor( (len / 2) + 1 );
let res = [];
for (let i = 0; i < lineNum; i++) {
// slice() 方法返回一个从开始到结束（不包括结束）选择的数组的一部分浅拷贝到一个新数组对象，且原始数组不会被修改。
let temp = baseArray.slice(i*n, i*n+n);
res.push(temp);
}
console.log(res);
通过数组中index 和 设定长度 来建立一个新数组，iconsArr[0].push(item)，封装方法如下：
function arrTrans(num, arr) { // 一维数组转换为二维数组
const iconsArr = []; // 声明数组
arr.forEach((item, index) => {
const page = Math.floor(index / num); // 计算该元素为第几个素组内
if (!iconsArr[page]) { // 判断是否存在
iconsArr[page] = [];
}
iconsArr[page].push(item);
});
return iconsArr;
},
数组元素为对象
当数组元素为对象的时候，就不能使用slice方法进行截取了，因为slice属于浅拷贝，导致的问题就是你修改了新生成的数组对象值，会影响原始数组中对象的值，但很多时候我们并不想影响原来的值。
深拷贝和浅拷贝主要是针对对象类型，基本类型并不涉及。（之前在深拷贝和浅拷贝写过错误代码，一言难尽）
let objArray = [{a: 1}, {b: 2}, {c: 3}, {d: 4}, {e: 5}, {f: 6}, {g: 7}];
let len = objArray.length;
let n = 4; //假设每行显示4个
let lineNum = len % 4 === 0 ? len / 4 : Math.floor( (len / 4) + 1 );
let res = [];
for (let i = 0; i < lineNum; i++) {
let temp = objArray.slice(i*n, i*n+n);
res.push(JSON.parse(JSON.stringify(temp)));//深度拷贝，产生新的数组
}
console.log(res);
知识点
flat() 方法会按照一个可指定的深度递归遍历数组，并将所有元素与遍历到的子数组中的元素合并为一个新数组返回。 flat除了有扁平化嵌套数组之外还可以扁平化空项。
