扁平化数组的几种方法

栏目: 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]复制代码

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

查看所有标签

猜你喜欢:

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

算法设计与分析

算法设计与分析

郑宗汉//郑晓明 / 清华大学 / 2011-7 / 45.00元

《算法设计与分析(第2版)》系统地介绍算法设计与分析的概念和方法,共4部分内容。第1部分介绍算法设计与分析的基本概念,结合穷举法、排序问题及其他一些算法,对算法的时间复杂性的概念及复杂性的分析方法作了较为详细的叙述;第2部分以算法设计技术为纲,从合并排序、堆排序、离散集合的union和find操作开始,进而介绍递归技术、分治法、贪婪法、动态规划、回溯法、分支与限界法和随机算法等算法设计技术及其复杂......一起来看看 《算法设计与分析》 这本书的介绍吧!

JSON 在线解析
JSON 在线解析

在线 JSON 格式化工具

URL 编码/解码
URL 编码/解码

URL 编码/解码

XML 在线格式化
XML 在线格式化

在线 XML 格式化压缩工具