js二维数组转一维数组的方法

在前端web中可能在某些的场景下需要将一个二维数组转为一维数组，在js脚本中也提供了一些方法，比如flat()方法，concat方法等。下面73so博客就详细的介绍一下。

js创建二维数组

二维数组：二维数组在本质上来说是以数组做为数组元素的数组，也可以称作为数组的数组。

例1：

var arr = new Array();
for(var i=0;i<5;i++){ 
    arr[i]=new Array(i); 
    for(var j=0;j<5;j++){ 
        arr[i][j]=i;
    }
}

例2：

var arr = new array();
for(var i=0;i<5;i++){
    arr[i]=new array(); 
    for(var j=0;j<5;j++){ 
        arr[i][j]=1
    }
}

js二维数组转一维数组的方法

1、flat方法二维数组转一维

flat()：为es10中新增加的方法，它会按照一个可指定的深度递归扫描数组，并将所有的元素与遍历到的子数组中的元素合并成一个新的数组。

例：

let arr = [1, 2, 3, [1, 2, 3]];
console.log(arr.flat()); 
// [1, 2, 3, 1, 2, 3]

例2：

如果二维数组的层数过多，可以指定转换的层数

let arr = [1, 2, 3, [1,[1,2,3], 2, 3]];
console.log(arr.flat(2)); 
// [1, 2, 3, 1, 1, 2, 3, 2, 3]

例：

如果对于要转换的函数不了解，可以传参数Infinity

let arr = [1, 2, 3, [1,[1,[1,2,3],2,3], 2, 3]];
console.log(arr.flat(Infinity)); 
// [1, 2, 3, 1, 1, 1, 2, 3, 2, 3, 2, 3]

2、concat方法

concat()：用于合并两个或多个数组，此方法不会更改现有的数组，而返回一个新数组。

扩展运算符（...）：可以将数组转为用逗号分隔的参数序列

例：

let arr = [1, 2, 3, [1, 2, 3], 2, 3];
console.log([].concat(...arr)); 
// [1, 2, 3, 1, 2, 3, 2, 3]

注：此方法无法将多维数组转为一维数组。

3、toString方法 + split方法

(1)、利用toString 把数组转成字符串

(2)、split 把字符串转回数组

let arr = [1, [1, 2], [3, 4]]
let arrnew = arr.toString().split(",").map((item) => +item)
console.log(arrnew);
// [1, 1, 2, 3, 4]

注：此方法对于一些含有特殊字符的子元素，比如含有null,undefined,对象类型则无法完成转换。

以上就是js中将二维数组转为一维数组的方法，各位可以测试一下。