js实现数组扁平化的几种方式

数组扁平化就是将一个多维数组转换为一个一维数组

比如：[1,[2,[3,4,5]]] ==> [1,2,3,4,5]

1、递归实现

let arr = [1, [2, [3, 4, 5]]];
function flatten(arr) {
  let result = [];

  for(let i = 0; i < arr.length; i++) {
    if(Array.isArray(arr[i])) {
      result = result.concat(flatten(arr[i]));
    } else {
      result.push(arr[i]);
    }
  }
  return result;
}
console.log(flatten(arr));  //  [1, 2, 3, 4，5]

2、reduce递归解法

function fReduce(arr) {
    return arr.reduce((pre, cur) => {
        return pre.concat(Array.isArray(cur) ? fReduce(cur) : cur)
    }, [])
}

3、split 和 toString

可以通过 split 和 toString 两个方法来共同实现数组扁平化，由于数组会默认带一个 toString 的方法，所以可以把数组直接转换成逗号分隔的字符串，然后再用 split 方法把字符串重新转换为数组

var arr = [1, [2, [3, 4, 5]]];

function flatten(arr) {
    arr = arr.toString().split(',');
    var newArr = arr.map((item) => {
        item = +item
        return item
    })
    return newArr
}

console.log(flatten(arr)); //  [1, 2, 3, 4, 5]

4、通过扩展运算符实现

这个方法的实现，采用了扩展运算符和 some 的方法

let arr = [1, [2, [3, 4]]];
function flatten(arr) {
    while (arr.some(item => Array.isArray(item))) {
        arr = [].concat(...arr);
    }
    return arr;
}
console.log(flatten(arr)); //  [1, 2, 3, 4，5]

5、ES6 中的 flat
我们还可以直接调用 ES6 中的 flat 方法来实现数组扁平化

let arr = [1, [2, [3, 4]]];
function flatten(arr) {
  return arr.flat(Infinity);
}
console.log(flatten(arr)); //  [1, 2, 3, 4，5]

6、json和正则过滤

const flatten = (arr) => {
    let str = JSON.stringify(arr);
    str = str.replace(/(\[|\])/g,'');
    str = `[${str}]`;
    return JSON.parse(str);
  };

7、apply 改变this的指向

function flatten(arr) {
  while (arr.some((item) => Array.isArray(item))) {
    // 改变的 concat的this指向 把arr传入进去了
    // concat 语义：数组链接concat的n个参数
    // 加上了 apply([],arr) 语义：把concat的this指向改变了，concat的this指向 [] , 参数是 arr 【已知apply的传参是数组列表，里面接收参数是arg形参】
    arr = [].concat.apply([], arr);
  }
  return arr;
}

书写不易，支持一下吧！