美文网首页深究JavaScript
扁平化数组的几种方法

扁平化数组的几种方法

作者: 玄月府的小妖在debug | 来源:发表于2017-08-30 15:36 被阅读98次

1.递归

function flat(arr){
    var res =[];
    for (var i=0;i<arr.length;i++){
        if (Array.isArray(arr[i])){
            res=res.concat(flat(arr[i]));
        }
        else{
            res.push(arr[i])
        }
    }
    return res
}

test:

2.toString

如果数组的元素都是数字,那么我们可以考虑使用 toString 方法,因为: toString会将数组中的数以逗号形式结合起来。

[1,2,[3,4,[5,6]],8].toString()
"1,2,3,4,5,6,8"

so...

function flat(arr) {
    return arr.toString().split(",").map((item) => {
        return +item
    });
}

test:

flat(arr)
[1, 2, 3, 4, 5, 6, 8]

3.reduce

function flat(arr){
    return arr.reduce((pre, item) => {
        console.log(item);
        return pre.concat(Array.isArray(item) ? flat(item) : item);
    }, [])
}

test:


4.es6

function flat(arr){
    while(arr.some((item)=>{ return Array.isArray(item)})){
        arr = [].concat(...arr)
    }
    return arr;
}
flat(arr)
[1, 2, 3, 4]

由于扩展运算符一次只能展开一层数组:

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

因此考虑只要数组中还有数组,就使用扩展运算符展开一次。
参考文档:
http://blog.csdn.net/crystal6918/article/details/77130948

相关文章

  • JS 数组扁平化的5种方式

    什么是数组扁平化 数组扁平化是指将一个多维数组变为一维数组 数据准备 实现方法一 实现方法二 实现方法三 实现方法...

  • 用JavaScript实现的5个常见函数

    数组扁平化 数组扁平化有很多方法,但最终最好的方法就是递归,实现一个指定深度的扁平化方法,这样基本的套路都会了解。...

  • js小算法

    1、数组扁平化 数组扁平化是指将一个多维数组变为一个一维数组 方法1:使用flat() 方法2:利用正则,但数据类...

  • 扁平化数组的几种方法

    1.递归 test: 2.toString 如果数组的元素都是数字,那么我们可以考虑使用 toString 方法,...

  • 扁平化数组的几种方法

    一、扁平化的概念 扁平化管理是企业为解决层级结构的组织形式在现代环境下面临的难题而实施的一种管理模式。当企业规模扩...

  • 数组扁平化的几种方法

    使用reduce方法递归实现 使用toString() 和map 方法 [1, [2, 3, [4, 5]]].t...

  • 封装常用数组操作函数

    1. 数组扁平化 方法一 : 递归迭代数组 方法二 : 通过js原生 falt方法展开数组 方法三 通过正则...

  • 前端手写算法题

    1、深拷贝deepCopy 2、对象扁平化 3、数组扁平化 4、手写Promise 5、promise.all方法...

  • 数组扁平化 Flat() 方法的原理

    数组扁平化:就是讲多维数组转换为一维数组常用的方法有:flat()、reduce、toString & spl、j...

  • JS算法题总结

    1. 对象深克隆 2. 数组去重 方法一: 方法二: 3. 数组扁平化 方法一: 方法二: 4. 冒泡排序

网友评论

    本文标题:扁平化数组的几种方法

    本文链接:https://www.haomeiwen.com/subject/lyvtjxtx.html