假设有一个很复杂的数据,并且数据嵌套层数很多。如何避免用三层for循环呢?

有以下梨子,我们需要找到val值为12的,这个对象?

  'use strict'
let groups = [{
content: [{
permissions: [{
val: 1
}, {
val: 2
}]
}, {
permissions: [{
val: 3
}, {
val: 4
}]
}]
}, {
content: [{
permissions: [{
val: 5
}, {
val: 6
}]
}, {
permissions: [{
val: 7
}, {
val: 8
}]
}]
}, {
content: [{
permissions: [{
val: 9
}, {
val: 10
}]
}, {
permissions: [{
val: 11
}, {
val: 12
}]
}]
}] console.log(groups);
let filterA = groups
.map(a => a.content)
.flat() //数组扁平化
.map(b => b.permissions)
.flat()
.filter(c => c.val === 12) console.log(filterA);

由于flat语法,需要在chrome69以上版本来进行调试哦

  let filterA = groups
.map(a => a.content)
.flat() //数组扁平化
.map(b => b.permissions)
.flat()
.filter(c => c.val === 12)

代码的逻辑比较简单,符合函数式编程的思想。

map//返回一堆新数组,不改变源数组,我们就可以获取到下一层,但是数组的层数依旧还是3层,

所以需要flat,来消除一层数组,也就数组扁平化。

参考阮老师的解释

flat()默认只会“拉平”一层,如果想要“拉平”多层的嵌套数组,可以将flat()方法的参数写成一个整数,表示想要拉平的层数,默认为1。
[1, 2, [3, [4, 5]]].flat()
// [1, 2, 3, [4, 5]] flat()的参数为2,表示要“拉平”两层的嵌套数组
[1, 2, [3, [4, 5]]].flat(2)
// [1, 2, 3, 4, 5] 如果不管有多少层嵌套,都要转成一维数组,可以用Infinity关键字作为参数。
[1, [2, [3]]].flat(Infinity)
// [1, 2, 3]

ES6 三层for循环的链式写法的更多相关文章

  1. JQuery事件的链式写法

    <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...

  2. jquery事件链式写法

    <!DOCTYPE html><html lang="en" xmlns="http://www.w3.org/1999/xhtml"> ...

  3. Delphi Sysem.JSON 链式写法(转全能中间件)

    链式写法有很多优点:连贯.语意集中.简洁.一气呵成.可读性强.比如要把 3.1415926 中的 59 提取为一个整数:Pi.ToString().Substring(5,2).ToInteger() ...

  4. ajax操作的链式写法

    ajax操作的传统写法: $.ajax({ url: url, success: function(){ doWhenSuccess(); }, error: function(){ doWhenEr ...

  5. Jquery | 基础 | 事件的链式写法

    $(".title").click(function () { $(this).addClass("curcol").next(".content&q ...

  6. Java 链式写法

    Java链式写法,子类继承父类的属性,也可以返回子类的对象,只是需要重写基类的Set方法 public class MyLS { public static void main(String[] ar ...

  7. Delphi Sysem.JSON 链式写法

    链式写法有很多优点:连贯.语意集中.简洁.一气呵成.可读性强.比如要把 3.1415926 中的 59 提取为一个整数:Pi.ToString().Substring(5,2).ToInteger() ...

  8. Java链式写法

    原创:转载需注明原创地址 https://www.cnblogs.com/fanerwei222/p/11613067.html Java 链式写法:详细看代码 package chain; /** ...

  9. javascript 链式写法

    熟悉Jquery的同学都知道,它对dom的操作基本都链式调用的写法,这种给人感觉就是很简洁,易懂,而且最大的好处就是避免多次重复使用一个对象变量. 链式的实现方式:链式操作是在对象的方法中通过最后返回 ...

随机推荐

  1. Text Relatives II

    [Text Relatives II] When your app determines that the user has requested the edit menu—which could b ...

  2. RocketMQ 服务器3模式

    22 a b-s---------------------------sh mqbroker -c $ROCKETMQ_HOME/conf/2m-2s-async/broker-a.propertie ...

  3. windows下Apache的虚拟主机配置

    1.Apache虚拟主机: 在Apache上有关于虚拟主机的具体说明,具体可以参考Apache手册,这里简单的说一下虚拟主机主要分为两种: 1.基于主机名的虚拟主机(一个IP地址,多个网站) 2.基于 ...

  4. int *a[] 与(int *)a【5】的区别

    *a[5] 是指针数组  可以指向5个值 (*a)[5]  是一个指针,但这个指针只能指向包含5个元素的一维数组 a是一个数组,每个元素都是个指针. b是一个指针,指向一个数组 1.int *a[5] ...

  5. 个人作业代码GitHub提交步骤

    代码提交地址: https://github.com/eudaem/homework1 步骤: 1)用个人账号登陆GitHub,并访问代码提交地址页面,点击页面右上角的“Fork”按钮,拷贝homew ...

  6. 软件项目第一个Sprint评分

    第一组 跑男 跑男组他们设计的是极速蜗牛小游戏,他们的界面背景图片做的挺漂亮,现在为止也实现了大部分功能, 但是我没有太听懂他们的游戏规则. 因为蜗牛出发后,每次碰到屏幕边缘后都会有确定的反弹结果,也 ...

  7. CAS实战の自定义登录

    由于每个版本的改动较大,所以先把版本号列出: 服务端版本:cas server 4.0.0 客户端版本:cas client 3.3.3 一.自定义登录页面 页面路径:/WebContent/WEB- ...

  8. jmeter测试mysql数据库之JDBC请求

    所有jmeter基本组件功能本文不做介绍.jmeter要链接mysql数据库,首先得下载mysql jdbc驱动包(注:驱动包的版本一定要与你数据库的版本匹配,驱动版本低于mysql版本有可能会导致连 ...

  9. 10-08常用的TIME和DATE函数以及各个函数对应的头文件

    系统时间和日期函数:     #include <time.h>     char *asctime(const struct tm *tm);//将tm中存放的信息转换为标准格式    ...

  10. 什么是ODBC和JDBC?

    jdbc是使用通过JAVA的数据库驱动直接和数据库相连,而jdbc-odbc连接的是ODBC的数据源,真正与数据库建立连接的是ODBC! 建议使用JDBC直接连接,同时最好使用连接池! JDBC 是 ...