zoukankan      html  css  js  c++  java
  • -----js实现数组扁平化-----

      首先让我们思考一个这样的题目;假如有一个数组 var arr = [1, [2, 3, [4]]] ,我们怎么能把arr变成[1, 2, 3, 4]呢?即让多维数组降维,转换为只有一层的数组;如果用过lodash的话,我们知道 flatten 和 flattenDeep 方法都可以实现.

    flatten用法:
    概念:可以理解为将嵌套数组的维数减少,flattened(平坦). 如果 isDeep 值为 true 时,嵌套数组将递归为一维数组, 否则只减少嵌套数组一个级别的维数.
    代码如下:
    参数: array (Array): 需要flattened(减少维数)的嵌套数组
    [isDeep] (boolean): 是否深递归
    返回值: (Array): 返回处理后的数组

    // using `isDeep`
    _.flatten([1, [2, 3, [4]]], true);
    // => [1, 2, 3, 4]
    1
    2
    3
    flattenDeep用法:
    概念:递归地平坦一个嵌套的数组.相当于_.flatten(array, true)
    **参数:**array (Array): 需要
    返回值:(Array): 返回处理后的数组.

    flattenDeep: 递归地平坦一个嵌套的数组.相当于_.flatten(array, true).

    _.flattenDeep([1, [2, 3, [4]]]);
    // => [1, 2, 3, 4]
    1
    2
    3
    4
    那么如果我们自己写该如何实现呢?下面列举几种实现方式:

    1. 循环数组+递归

    实现思路:循环数组,如果数据中还有数组的话,递归调用flatten扁平函数(利用for循环扁平),用concat连接,最终返回result;

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

    flatten(arr) // [1,2,3,4]
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    2. 利用apply

    可以使用apply的原因如下:

    var arr = [1, [2, 3, [4]]];
    [].concat.apply([],arr);
    // [1,2,3,[4]]
    1
    2
    3
    实现思路:利用arr.some判断当数组中还有数组的话,递归调用flatten扁平函数(利用apply扁平), 用concat连接,最终返回arr;

    function flatten(arr){
    while(arr.some(item => Array.isArray(item))){
    arr = [].concat.apply([],arr);
    }
    return arr;
    }

    flatten(arr) // [1,2,3,4]
    1
    2
    3
    4
    5
    6
    7
    8
    3. reduce方法

    reduce() 方法对累加器和数组中的每个元素(从左到右)应用一个函数,将其减少为单个值。
    能使用reduce原因如下:

    var flattened = arr.reduce(function(prev, cur){
    return prev.concat(cur)
    },[])

    console.log(flattened);
    // [1,2,3,[4]]
    1
    2
    3
    4
    5
    6
    实现思路:使用reduce, 当数组中还有数组的话,递归调用flatten扁平函数(利用reduce扁平), 用concat连接,最终返回arr.reduce的返回值;

    function flatten(arr){
    return arr.reduce(function(prev, cur){
    return prev.concat(Array.isArray(cur) ? flatten(cur) : cur)
    },[])
    }

    flatten(arr) // [1,2,3,4]
    1
    2
    3
    4
    5
    6
    7
    4. es6 展开运算符

    可以使用es6 展开运算符的原因如下:

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

    console.log(...arr);
    // 1,[2,3,[4]]
    1
    2
    3
    4
    实现思路:利用arr.some判断当数组中还有数组的话,递归调用flatten扁平函数(利用es6展开运算符扁平), 用concat连接,最终返回arr;

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

    flatten(arr) // [1,2,3,4]
    1
    2
    3
    4
    5
    6
    7
    8
    5. toString方法(数组元素为数字)
    如果数组的元素是数字,那么我们可以考虑toString()方法,其他情况不适用。原因如下:

    [1, [2, 3, [4]]].toString()
    // "1,2,3,4"
    1
    2
    实现思路:数组适用toString()方法后变成以逗号分割的字符串,然后map遍历数组把每一项再变回整数并返回map后的结果。

    function flatten(arr){
    return arr.toString().split(',').map(function(item){
    return parseInt(item);
    })
    }

    flatten(arr) // [1,2,3,4]

    原文链接:https://blog.csdn.net/original_heart/article/details/78906911

  • 相关阅读:
    Eclipse程序员要掌握的常用快捷键
    HDU 1166——敌兵布阵——————【线段树单点增减、区间求和】
    nyoj1032——Save Princess——————【set应用】
    nyoj1087——摆格子——————【规律题】
    hrb——开锁魔法I——————【规律】
    ACdream 1099——瑶瑶的第K大——————【快排舍半,输入外挂】
    ACdream 1098——圆有点挤——————【数学计算】
    FZU 1884——排火车——————【栈的模拟】
    FZU 1921——栀子花开——————【线段树单点更新】
    FZU 1924——死锁——————【topo判环】
  • 原文地址:https://www.cnblogs.com/zjy850984598/p/10463694.html
Copyright © 2011-2022 走看看