多维数组降维成一维数组

reduce()

var arr1 = [[0, 1], [2, 3], [4, 5]];
var arr2 = arr1.reduce(function (a, b) { return a.concat(b)} );
// arr2 [0, 1, 2, 3, 4, 5]

回调

优点: 多维数组也可以

比如:var arr = [[1,2],3,[[[4], 5]]]

var arr1 = [[0, 1], [2, 3], [4, 5]];
function flatten(arr) { return [].concat( ...arr.map(x => Array.isArray(x) ? flatten(x) : x) ) }
var arr2 = flatten(arr1); // arr2 [0, 1, 2, 3, 4, 5]

flat()

利用 ES 的最新语法,Array.prototype.flat()。缺点是,有兼容性问题(例360浏览器不支持, Chrome支持)。优点是非常简单。

mdn 上是这么描述的:flat() 方法会递归到指定深度将所有子数组连接,并返回一个新数组。

语法:var newArray = arr.flat(depth),参数说明:depth,可选,指定嵌套数组中的结构深度,默认值为1。

var arr1 = [1, 2, [3, 4]];
arr1.flat(); // [1, 2, 3, 4] var arr2 = [1, 2, [3, 4, [5, 6]]];
arr2.flat(); // [1, 2, 3, 4, [5, 6]] var arr3 = [1, 2, [3, 4, [5, 6]]];
arr3.flat(2); // [1, 2, 3, 4, 5, 6] //Infinity展开所有嵌套数组
arr3.flat(Infinity); // [1, 2, 3, 4, 5, 6] var arr4 = [1, 2, , 4, 5];
arr4.flat(); // [1, 2, 4, 5]

ES6 数组方法库的更多相关文章

  1. ES6数组扩展

    前面的话 数组是一种基础的JS对象,随着时间推进,JS中的其他部分一直在演进,而直到ES5标准才为数组对象引入一些新方法来简化使用.ES6标准继续改进数组,添加了很多新功能.本文将详细介绍ES6数组扩 ...

  2. ES6数组及数组方法

    ES6数组可以支持下面的几种写法: (1)var [a,b,c] = [1,2,3]; (2)var [a,[[b],c]] = [1,[[2],3]]; (3)let [x,,y] = [1,2,3 ...

  3. 数组的复制及ES6数组的扩展

    一.数组的复制 // alert([1,2,3]==[1,2,3]); let cc = [0,1,2]; let dd = cc; alert(dd==cc);//此时改变dd会影响cc ES5 只 ...

  4. es6数组的扩展

    数组扩展运算符 ...(三个点) const demoArr=[0,1,2,3,4] console.log(...demoArr) // 0 1 2 3 4 // 他把一个数组用逗号分隔了出来 // ...

  5. ES6 数组方法拓展

    ES6 数组方法拓展 1.Array.from() Array.from方法用于将两类对象转为真正的数组:类似数组的对象(array-like object)和可遍历(iterable)的对象(包括E ...

  6. ES6数组相关

    ES6数组新增的几个方法: 1. forEach() //forEach()遍历数组,无返回值,不改变原数组 var arr=[1,2,3,4] arr.forEach((item,index,arr ...

  7. ES6数组新加 Buff

    欢迎关注本人公众号<迈向大前端>,里面有15本前端相关的电子书,送给在前端路上迷茫的同学们! 本章篇幅很长,分开来发,这一小篇主要讲ES6数组的Array.of()和Array.from( ...

  8. ES6数组的扩展--Array.from()和Array.of()

    一. Array.from() : 将伪数组对象或可遍历对象转换为真数组 1.何为伪数组 如果一个对象的所有键名都是正整数或零,并且有length属性,那么这个对象就很像数组,语法上称为"类 ...

  9. JavaScript ES6 数组新方法 学习随笔

    JavaScript ES6 数组新方法 学习随笔 新建数组 var arr = [1, 2, 2, 3, 4] includes 方法 includes 查找数组有无该参数 有返回true var ...

随机推荐

  1. Python 用load_workbook 读取excel某个单元格数据、读取excel行数、列数

    from openpyxl import load_workbook path = r'D:\pywork\12' # EXCEL信息所在文件夹 e= load_workbook(path + '/' ...

  2. Vue源码解析,keep-alive是如何实现缓存的?

    前言 在性能优化上,最常见的手段就是缓存.对需要经常访问的资源进行缓存,减少请求或者是初始化的过程,从而降低时间或内存的消耗.Vue 为我们提供了缓存组件 keep-alive,它可用于路由级别或组件 ...

  3. mongodb在win10下的安装和配置

    一.准备 下载mongodb https://www.mongodb.com/download-center/community 该实例中使用的是:mongodb-win32-x86_64-2008p ...

  4. java 二分查找的注意事项

    二分查找也是最简单的算法之一了.但是最近发现一般的写法会有问题. public int search(int[] nums, int target) { int left = 0; int right ...

  5. vant官网无法打开,这里教你解决

    是否大家和我一样,vant-weapp官网突然打不开了   像这样: 但我发现在码云上有一个国内的版本 https://vant-contrib.gitee.io/vant/#/zh-CN/home, ...

  6. gorilla/mux 的学习

    原文链接:gorilla/mux的学习 源代码: package main import ( "encoding/json" "fmt" "githu ...

  7. src rpm 下载地址

    drbd: http://mirror.rackspace.com/elrepo/elrepo/el7/SRPMS/ rabbitmq: https://dl.bintray.com/rabbitmq ...

  8. jQuery 事件操作

    入口函数 使用$(document).ready(()=>{})作为jQuery入口函数,与window.onload(()=>{})类似,但它不会等待图片等外部资源的加载完毕,而是在HT ...

  9. 《Head First 设计模式》:外观模式

    正文 一.定义 外观模式提供了一个统一的接口,用来访问子系统中的一群接口.外观定义了一个高层接口,让子系统更容易使用. 要点: 外观模式将一个或数个类的复杂的一切都隐藏在背后,只显露出一个干净美好的外 ...

  10. Docker 学习笔记(一)

    Docker 入门 Docker 学习 概述 安装 命令 镜像命令 容器命令 操作命令 Docker 镜像 容器数据卷 DockerFile Docker网络原理 IDEA 整合Docker 单机版D ...