JS 一维数组 和 二维数组之间的相互转换
- 二维数组转一维数组
- 一、需求
- 二、分析
- 1. 方法一（ES5）
- 2. 方法二（ES6）
- 3. 方法三（ES6）
- 3. 方法四（ES5）
- 4. 特殊说明：flat()方法会移除数组中的空项。但undefined、null仍会保留。
- 一维数组转二维数组
- 一、需求
- 二、分析
- 1. 方法一，使用高阶函数
二维数组转一维数组
一、需求
在日常开发中，我们可能会遇到返回的数据不能直接使用，而数据提供者只给你传递二维数据格式的数据，这个时候就需要我们做转换，下面是总结的一些方法，可供参考
二、分析
1. 方法一（ES5）
- 利用es5的arr.reduce(callback[, initialValue])实现
var arr1 = [[0, 1], [2, 3], [4, 5]];
var arr2 = arr1.reduce(function (a, b) { return a.concat(b)} );
// arr2 [0, 1, 2, 3, 4, 5]
2. 方法二（ES6）
- 可以使用Array.prototype.flat()方法来将二维数组转为一维数组。
const arr2d = [[1, 2], [3, 4], [5, 6]];
const arr1d = arr2d.flat();
console.log(arr1d); // [1, 2, 3, 4, 5, 6]
3. 方法三（ES6）
- 如果想要将多维数组转为一维数组，可以使用Array.prototype.flat(depth)方法，传入一个数值参数 depth 来指定要将数组展开到多少层。
const arr3d = [[[1, 2], [3, 4]], [[5, 6], [7, 8]]];
const arr1d = arr3d.flat(2);
console.log(arr1d); // [1, 2, 3, 4, 5, 6, 7, 8]
3. 方法四（ES5）
- 以上两个方法在 ES6 中引入，如果需要兼容旧版本浏览器，可以使用以下 polyfill 来实现：
if (!Array.prototype.flat) {
Array.prototype.flat = function(depth) {
var flattened = [];
(function flat(array, depth) {
for (var i = 0; i < array.length; i++) {
if (Array.isArray(array[i]) && depth > 0) {
flat(array[i], depth - 1);
} else {
flattened.push(array[i]);
}
}
})(this, Math.floor(depth) || 1);
return flattened;
};
}
4. 特殊说明：flat()方法会移除数组中的空项。但undefined、null仍会保留。
var arr = [1, 2, undefined , 4, 5, null];
arr.flat(); // [1, 2, undefined , 4, 5, null]
一维数组转二维数组
一、需求
在日常开发中，我们可能会遇到返回的数据不能直接使用，而数据提供者只给你传递一维数据格式的数据，这个时候就需要我们做转换，下面是总结的一些方法，可供参考
二、分析
1. 方法一，使用高阶函数
function convertArray(arr, columns) {
return arr.flatMap((item, index) =>
index % columns ? [] : [arr.slice(index, index + columns)]
);
}
convertArray([1,2,3,4,5,6],2)
