多维数组降维成一维数组

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. 走正确的路 - IT业没有护城河 - 机器翻译新锐Deepl

    最近发生了一件很令我震惊的事情:新的一个机器翻译网站出现了 - www.deepl.com (DeepL 或许会成为你今年首选的翻译工具) 机器翻译早就是红海市场了.我就不从1954年IBM发布俄翻英 ...

  2. leetcode刷题记录——哈希表

    1.两数之和 可以先对数组进行排序,然后使用双指针方法或者二分查找方法.这样做的时间复杂度为 O(NlogN),空间复杂度为 O(1). 用 HashMap 存储数组元素和索引的映射,在访问到 num ...

  3. 开始进行lammps手册的学习啦,跟着Manual一边翻译一边做吧!(转载)

    转载自:http://blog.sina.com.cn/s/blog_64813e370100ngsz.html 注明:黄色部分基本上为不懂的部分,红色字体为所做注释 一.各种文件的介绍: 1 in ...

  4. Linux 部署java web 项目,验证码图片不显示文字问题

    系统上线后,在获取验证码接口时,获取的验证码图片上没有对应的验证码数字,经过验证后,是由于Linux缺少字体造成的. 正常我们也可以将window的字体直接上传到linux服务器上,window的字体 ...

  5. 2020,最新Model的设计-APP重构之路

    很多的app使用MVC设计模式来将“用户交互”与“数据和逻辑”分开,而model其中一个重要作用就是持久化.下文中设计的Model可能不是一个完美的,扩展性强的model范例,但在我需要重构的app中 ...

  6. react 有没有类似vue中watch这样的api?

    就是 当组件里state 里的数据发生变化可以监听到这个数据的变化 当数据发生变化的时候做一些事情 比如ajax请求 ?初学react 用vue的时候会用watch 和computed 去监听数据发生 ...

  7. Nodejs模块:path

    当前版本:v 10.16.0 一,获取文件相关信息 1,path.basename(filepath[, ext]) 获取该文件的文件名,如果有扩展名,则一起显示扩展名: 如果不想展示扩展名,只想展示 ...

  8. Labview学习之路(一)程序框图中的修饰

    很多小伙伴知道在前面板有很多修饰符,比如上凸框,加粗下凹框等等,但是其实在程序框图中也是有修饰符的,他的位置比较隐蔽,并且修饰符很少,所以很多人基本没有用过.现在就给大家介绍一些这些程序框图种的修饰. ...

  9. Funny Positive Sequence (思维+前缀)

    There are n integers a 1,a 2,…,a n-1,a n in the sequence A, the sum of these n integers is larger th ...

  10. vue require.context自动化导入

    语法: require.context(directory, useSubdirectories = false, regExp = /^.//); directory {String} -读取文件的 ...