No matter in the actual development of the project, or in the interview, you will encounter the need to expand the multidimensional array into a one-dimensional array, so how should we deal with it? I have summarized several common and effective methods, without further ado, please read on

ES6 new array extension method Flat ()

let arr = [1.2.3[4.5].6];
let res = arr.flat();/ / [6]
Copy the code

Flat () can only stretch one layer by default, but what if I need to deal with multiple nested arrays, namely two-dimensional + arrays? To solve this problem, I went to the technical documentation of Flat () and came to the following conclusion:

let arr1 = [1.2.3[4.5[6.7]],8];
let res1 = arr.flat(3);// the parameter 3 represents the expansion of the three-dimensional array, resulting in [1,2,3,4,5,6,7,8]

let arr2 = [1.2.3[4.5[6.7[8]]].9];
let res2 = arr2.flat(4);[1,2,3,4,5,6,7,8,9].Copy the code

However, if the array dimension is known, it can be handled. If the array level is unknown, it is quite unfriendly. So, what method should we use to expand the unknown multi-dimensional nested array? Look at the code:

let arr3 = [1.2.3[4.5[6.7[8]]].9];
let res3 = arr3.flat(Infinity);//参数为Infinity,结果为[1,2,3,4,5,6,7,8,9]
Copy the code

So no matter how many levels of nesting you’re dealing with, you’re dealing with the one-dimensional array that you want.

Method two: Use apply() with concat() to expand into a one-dimensional array

let arr4 = [1.2.3[4.5].6];
let res4 = [].concat.apply([],arr4);// result is [1,2,3,4,5,6]
Copy the code

Although this method can be handled, there is a defect that needs to be pointed out, that is, this method can only expand the two-dimensional array into one dimension, and the processing of multi-dimensional array above two dimensions needs to cycle through layer by layer using this method, which is a bit troublesome. If you want to use a simple method, please refer to method one.

Method 3: Combine reduce() with concat()

let arr5 = [[0.1], [2.3]].let res5 = arr5.reduce(
  (acc, cur) = > {
    returnacc.concat(cur); });// result is [0,2,3,4]
Copy the code

Note that this method is similar to method 2 in that you need to do something else with multidimensional arrays.

Method 4: In view of the defects of method 1 and method 2, recursive methods can be used to expand

let arr6 = [1.2[3.4[5.6].7].8]
function flatten(arr){
	let res6 = [];
	for(let i=0; i < arr.length; i++){
		if(Array.isArray(arr[i])){
			res6 = res6.concat(flatten(arr[i])) 
		}else{
			res6.push(arr[i])
		}
	}
	return res6;
}
Flatten(arr6);// result is [1,2,3,4,5,6,7,8]
Copy the code

Method 5: Use the toString() and split(‘,’) methods

If the array elements are all numbers, then we can use the toString method because: toString combines the array elements with commas. ToString () is followed by split(‘,’) to an array and converted back to a numeric array:

var arr = [1[2[3.4], [5[6], [7.8]]]];
var arrStr = arr.toString();
console.log(arrStr);/ / 1,2,3,4,5,6,7,8
var strArr = arrStr.split(', ');
console.log(strArr)//["1", "2", "3", "4", "5", "6", "7", "8"]
Copy the code

This method only works if the array is full of numbers.

Method 6: Use reduce and concat methods, combined with recursion, using another method of rewriting the prototype

Array.prototype.flatten=function(){
  return this.reduce(function(prev, cur) {
    var moreArr = [].concat(cur).some(Array.isArray); // check whether cur is an array
    return prev.concat(moreArr ? cur.flatten() : cur);
  },[]);
};
var bbb = [1.2.3[4[5.6[7.8]]]]
var ccc=bbb.flatten();
console.log(ccc);// Result is [1, 2, 3, 4, 5, 6, 7, 8]
Copy the code

Method 7: ES6 extension operator

function flatten(arr){
  while(arr.some(item= >Array.isArray(item))){ arr = [].concat(... arr); }return arr;
}
var sunArr = [1.2.3[4[5[6]]]];
flatten(sunArr);// Result is [1, 2, 3, 4, 5, 6]
Copy the code

OK, the above methods need to be used according to different needs, and you are welcome to add and discuss other methods in the comment section.