【dbsgw】js数组扁平化

数组扁平化的几种方式（总结出就三种方式）

• 递归
• es6的flat函数
• 字符串

var arr = [1,2,[3,4,5,[6,7,8],9],10,[11,12]];

1. 递归模式（递归里面需要用到concat链接数组，而不是push添加元素【使用push无法平铺】）

function fn(arr) {
    let newArr = []
    arr.forEach(v => {
        // 递归 要用concat 合并数组 ，原因：递归返回的是数组
        newArr = newArr.concat(Array.isArray(v) ? fn(v) : v)
    })
    return newArr
}

2. reduce递归解法

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

3. es6 flat函数

function fFlat(arr) {
    return arr.flat(Infinity)
}

4. toString（toString之后会自动去掉数组的中括号，在通过split(',')合并成数组）

function fToString(arr) {
    return arr.toString().split(',')
}

5. 扩展运算符（arr.some() 会返回arr里面只要有数组就是true，在通过扩展运算符展开数组）【[].concat(...arr)，会把每个元素都展开放到concat的形参上面去】

function flatten (arr) {
    while (arr.some(v=>Array.isArray(v))) {
        arr = [].concat(...arr)
    }
    return arr
}

6. json和正则过滤（转json字符串，在正则过滤掉中括号 []，在json转义一下，简直是精彩）

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

7. apply 改变this的指向 【注意 apply的用法】（原理和扩展运算符差不多，只是用了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;
}