扁平化数组的几种方法

栏目: JavaScript · 发布时间: 5年前

内容简介:扁平化管理是企业为解决层级结构的组织形式在现代环境下面临的难题而实施的一种管理模式。当企业规模扩大时,原来的有效办法是增加管理层次,而现在的有效办法是增加管理幅度。当管理层次减少而管理幅度增加时,金字塔状的组织形式就被“压缩”成扁平状的组织形式。flat()方法会按照一个可指定的深度depth递归遍历数组,并将所有元素与遍历到的子数组中的元素合并为一个新数组返回。该方法不会改变原数组

一、扁平化的概念

扁平化管理是企业为解决层级结构的组织形式在现代环境下面临的难题而实施的一种管理模式。当企业规模扩大时,原来的有效办法是增加管理层次,而现在的有效办法是增加管理幅度。当管理层次减少而管理幅度增加时,金字塔状的组织形式就被“压缩”成扁平状的组织形式。

二、数组扁平化

用于将嵌套多层的数组“拉平”,变成一维的数组

1、[1, [2]] => [1,2]
2、[[1, 2], [3, 4]] => [1, 2, 3, 4]
3、[1, 2, [3, 4, [5, 6]]] => [1, 2, 3, 4, 5, 6]复制代码

三、数组扁平化的几种方法

【1】Array​.prototype​.flat()

flat()方法会按照一个可指定的深度depth递归遍历数组,并将所有元素与遍历到的子数组中的元素合并为一个新数组返回。该方法不会改变原数组

语法: let newArray = arr.flat(depth)

描述: depth为指定要提取嵌套数组的结构深度,默认值为 1

flat() 方法会移除数组中的空项

例子:

let arr1 = [1, 2, [3, 4]];
    arr1.flat(); // [1, 2, 3, 4]

    // 指定要提取嵌套数组的结构深度为1层
    let arr2 = [1, 2, [3, 4, [5, 6]]];
    arr2.flat(1); // [1, 2, 3, 4, [5, 6]]

    // 指定要提取嵌套数组的结构深度为2层
    let arr3 = [1, 2, [3, 4, [5, 6]]];
    arr3.flat(2); // [1, 2, 3, 4, 5, 6]

    // 使用 Infinity 作为深度,展开任意深度的嵌套数组
    let arr4 = [1, 2, [3, 4, [5, 6]]]
    arr4.flat(Infinity); // [1, 2, 3, 4, 5, 6]

    // 移除数组中的空项
    let arr5 = [1, 2, , 4, 5];
    arr5.flat(); // [1, 2, 4, 5]复制代码

【2】归并方法 reduce()

我们用reduce函数进行遍历,把 prev 的初值赋值为[],如果当前的值是数组的话,那么我们就递归遍历它的孩子,如果当前的值不是数组,那么我们就把它拼接进数组里。

let arr = [[1, 2, [3, 4], 5], [6, 7, 8], [[9, 10], 11]];
    function flat(arr) {
      return arr.reduce(function (prev, cur) {
        return prev.concat(Array.isArray(cur) ? flat(cur) : cur);
      }, [])
    }
    console.log(flat(arr)); // [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11]复制代码

【3】toString()

toString()方法有很大局限性,只适用于数组元素全部为数字的情况下

// toString && Json.parase
    let arr = [[1, 2, [3, 4], 5], [6, 7, 8], [[9, 10], 11]];
    function flat(arr) {
      var str = arr.toString();
      return JSON.parse('[' + str + ']');
    }
    console.log(flat(arr)); // [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11]

    // toString && split
    let arr = [[1, 2, [3, 4], 5], [6, 7, 8], [[9, 10], 11]];
    function flat(arr) {
      return arr.toString().split(',').map(item => {
        return Number(item)
      })
    }
    console.log(flat(arr)); // [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11]

    // join && split
    let arr = [[1, 2, [3, 4], 5], [6, 7, 8], [[9, 10], 11]];
    function flat(arr) {
      return arr.join(',').split(',').map(item => {
        return Number(item);
      })
    }
    console.log(flat(arr)); // [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11]复制代码

【4】循环+递归

递归的遍历每一项,若为数组则继续遍历,否则 concat

let arr = [[1, 2, [3, 4], 5], [6, 7, 8], [[9, 10], 11]];
    function flat(arr) {
      let result = [];
      arr.map(item => {
        if (Array.isArray(item)) {
          result = result.concat(flat(item));
        } else {
          result.push(item);
        }
      });
      return result;
    }
    console.log(flat(arr)); // [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11]复制代码

【5】扩展运算符. . .

... 用于取出参数对象的所有可遍历属性,拷贝到当前对象中

let arr = [[1, 2, [3, 4], 5], [6, 7, 8], [[9, 10], 11]]
    function flat(arr) {
      while (arr.some(item => Array.isArray(item))) {
        arr = [].concat(...arr);
      }
      return arr;
    }
    console.log(flat(arr)); // [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11]复制代码

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持 码农网

查看所有标签

猜你喜欢:

本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们

信息论基础

信息论基础

[美] Thomas M.Cover,Joy A.Thomas / 机械工业出版社 / 2005-5 / 56.00元

信息论基础,ISBN:9787111162452,作者:(美)Thomas M.Cover,(美)Joy A.Thomas著;阮吉寿,张华译一起来看看 《信息论基础》 这本书的介绍吧!

JS 压缩/解压工具
JS 压缩/解压工具

在线压缩/解压 JS 代码

随机密码生成器
随机密码生成器

多种字符组合密码

UNIX 时间戳转换
UNIX 时间戳转换

UNIX 时间戳转换