原文

flat()接收一个数组(这个数组中的某些item本身也是一个数组),返回一个新的一维数组(如果没有特别指定depth参数的话返回一维数组)。

const nestedArraysOhMy = [ "a", ["b", "c"], ["d", ["e", "f"]]];
// .flat() 接收一个可选的深度参数
const ahhThatsBetter = nestedArraysOhMy.flat( 2 );
console.log( ahhThatsBetter ); // [ "a", "b", "c", "d", "e", "f" ]

flatMap()类似于map(),但是它的callback返回的是扁平的一维数组(如果没有特别指定depth参数的话)。

const scattered = [ "my favorite", "hamburger", "is a", "chicken sandwich" ];

// map() 返回的是嵌套的数组results in nested arrays
const huh = scattered.map( chunk => chunk.split( " " ) );
console.log( huh ); // [ [ "my", "favorite" ], [ "hamburger" ], [ "is", "a" ], [ "chicken", "sandwich" ] ] const better = scattered.flatMap( chunk => chunk.split( " " ) );
console.log( better ); // [ "my", "favorite", "hamburger", "is", "a", "chicken", "sandwich" ]

[笔记]JS flat and flatMap的更多相关文章

  1. amazeui学习笔记--js插件(UI增强)--警告框Alert

    amazeui学习笔记--js插件(UI增强)--警告框Alert 一.总结 1.警告框基本样式:用am-alert声明div容器, <div class="am-alert" ...

  2. amazeui学习笔记--js插件(UI增强4)--下拉组件Dropdown

    amazeui学习笔记--js插件(UI增强4)--下拉组件Dropdown 一.总结 1.am-dropdown(及其孩子):控制下拉列表的样式 2.data-am-dropdown(及其孩子):控 ...

  3. amazeui学习笔记--js插件(UI增强3)--折叠面板Collapse

    amazeui学习笔记--js插件(UI增强3)--折叠面板Collapse 一.总结 注意点: 1.data-am-collapse:这个东西就是展开折叠事件 2.am-collapse(包括其下属 ...

  4. amazeui学习笔记--js插件(UI增强2)--按钮交互Button

    amazeui学习笔记--js插件(UI增强2)--按钮交互Button 一.总结 1.按钮loading状态: <button type="button" class=&q ...

  5. 前端学习:学习笔记(JS部分)

    前端学习:学习笔记(JS部分) 前端学习:JS学习总结(图解)    JS的简介 JS基本语法 JS内置对象 JS的函数 JS的事件 JS的BOM JS的DOM JS的简介 新建步骤 <body ...

  6. 读书笔记 - js高级程序设计 - 第十五章 使用Canvas绘图

    读书笔记 - js高级程序设计 - 第十三章 事件   canvas 具备绘图能力的2D上下文 及文本API 很多浏览器对WebGL的3D上下文支持还不够好   有时候即使浏览器支持,操作系统如果缺缺 ...

  7. 笔记——js 数组

    JS阅读笔记--数组[Array] 最近在看zepto源码,里面用到了很多基础知识,借此机会又把基础知识复习和整理了一遍,算是温故而知新吧.先从引用类型Array写起吧 1. length属性 代码: ...

  8. JavaScript学习笔记——JS中的变量复制、参数传递和作用域链

    今天在看书的过程中,又发现了自己目前对Javascript存在的一个知识模糊点:JS的作用域链,所以就通过查资料看书对作用域链相关的内容进行了学习.今天学习笔记主要有这样几个关键字:变量.参数传递.执 ...

  9. 学习笔记-JS公开课一

    JS公开课笔记 没特别说明就是和Java语言一样. JS变量:弱类型语言 1.在JS中,true表示1,false表示0.和Java不一样. 2. var y: 提示undefined: 3.如果al ...

随机推荐

  1. pyspider安装提示:got an unexpected keyword argument 'io_loop'的解决办法

    此问题解决办法学习自pyspider的github的issues 原地址:https://github.com/binux/pyspider/issues/771 解决方法: 由于最新版的Tornad ...

  2. Go语言打造以太坊智能合约测试框架(level2)

    传送门: 柏链项目学院 第二课 智能合约自动化编译 前期内容回顾 之前我们的介绍的是如何通过solc编译智能合约,并且调用智能合约,本节我们继续实践,将智能合约的代码自动化编译以及abi文件生成搞定. ...

  3. RESTful学习及应用

    原文转自前端路上,转载请注明出处:http://refined-x.com/2017/09/22/RESTful学习及应用/ RESTful是什么 RESTful是一种API架构,符合REST设计原则 ...

  4. 关于mysql的报错的1366

    报错的的代码: Warning: (1366, "Incorrect string value: '\\xD6\\xD0\\xB9\\xFA\\xB1\\xEA...' for column ...

  5. 把python学的让自己成为智障的day14

    智障的第14天,今天还是装饰器,这也是这个难点,装饰器也是函数的其中一种,所以需要有返回值才能返回到之后要执行的函数中,当然,作为函数可以在其中带上参数,装饰器只是比较特殊,自然也可以带参数,目前来说 ...

  6. Effective C++ 第0章 explicit构造函数

    按照默认规定,只有一个参数的构造函数也定义了一个隐式转换,将该构造函数对应数据类型的数据转换为该类对象,如下面所示: class String { String ( const char* p ); ...

  7. Web 项目系列之浏览器机制(一)

    目录: ——初步认识浏览器 ——浏览器的渲染机制   ——浏览器的缓存机制 正文: 初步认识浏览器 想来任何一位读者,对浏览器都不会陌生.除开IT相关人员常用的Chrome(谷歌,Google).Fi ...

  8. Centos6.5-dnsmasq安装

    1.使用yum install dnsmasq -y 安装dns(含dns server和dns代理功能) 2.查询dnsmasq已经安装成功 [root@localhost ~]# rpm -q d ...

  9. Iterator和Enumeration的区别

    从源码可以看出,Iterator除了能读取集合的数据之外,也能数据进行删除操作:而Enumeration只能读取集合的数据,而不能对数据进行修改. Iterator支持fail-fast机制,而Enu ...

  10. Java8新特性(一)_interface中的static方法和default方法

    什么要单独写个Java8新特性,一个原因是我目前所在的公司用的是jdk8,并且框架中用了大量的Java8的新特性,如上篇文章写到的stream方法进行过滤map集合.stream方法就是接口Colle ...