当前位置: 首页 > news >正文

数组中的flat方法如何实现

数组的成员有时还是数组,Array.prototype.flat()用于将嵌套的数组“拉平”,变成一维的数组。该方法返回一个新数组,对原数据没有影响。

[1, 2, [3, 4]].flat()
// [1, 2, 3, 4]

那flat怎么来实现呢?

1、使用while循环

实现的代码如下:

        // 实现数组中的flat拉平函数let arr = [20, [6, 7, 8], [2, [9, 10]], 17]const flatten = function (arr) {while (arr.some(v => Array.isArray(v))) {arr = [].concat(...arr)}return arr;}console.log(flatten(arr)) // [20, 6, 7, 8, 2, 9, 10, 17]

2、使用数组中的map方法

        // 实现数组中的flat拉平函数let arr = [20, [6, 7, 8], [2, [9, 10]], 17]const flatten = function (arr) {return [].concat(...arr.map(v => Array.isArray(v) ? flatten(v) : v))}console.log(flatten(arr)) // [20, 6, 7, 8, 2, 9, 10, 17]

关于第二种方法的理解 最后的是

[].concat(...[20, [6, 7, 8], [2, 9, 10], 17]) // [20, 6, 7, 8, 2, 9, 10, 17]

扩展运算符会展开数组,相当于拉平一级。
concat方法合并数组,是往新数组中添加的数组成员,例如,[].concat(…[20, [6, 7, 8]])相当于[].concat(20, [6, 7, 8]),往[]这个空数组中添加的是数字20和[6, 7, 8]这个数组的成员6、7、8,所以[].concat(…[20, [6, 7, 8]])就相当于拉平了数组。

在用第二种方法时,我刚开始是有些不理解的,不过我推理了一下,确实是对的,其中的关键点在于递归调用、concat方法和扩展运算符的应用

最后,我们看一下concat的用法,
concat()方法用于合并两个或多个数组。此方法不会更改现有数组,而是返回一个新数组。
注意:合并的时候,添加的是数组成员,一定要谨记,如果不是数组,也当做成员,一起添加到新数组中。

let arr1 = [1,2,3];
let arr2 = [4,5,6];
let arr3 = [7,8,9];
let num = 10;console.log(arr1.concat(arr2,arr3,num)); // [1,2,3,4,5,6,7,8,9,10]

我们再看一下这个例子:

let arr1 = [1,[2,3]];
let num = 10;console.log([].concat(arr1,num)); // [1,[2,3],10]console.log([].concat(...arr1,num)); // [1,2,3,10] 

可以看到因为使用了扩展运算符,所以最后打印的结果是不一样的。

相关文章:

数组中的flat方法如何实现

数组的成员有时还是数组,Array.prototype.flat()用于将嵌套的数组“拉平”,变成一维的数组。该方法返回一个新数组,对原数据没有影响。 [1, 2, [3, 4]].flat() // [1, 2, 3, 4]那flat怎么来实现呢? 1、使用while循环 实现的代码…...

计算机考研|北航北理北邮怎么选?

北航985,北理985,北邮211 虽然北邮事211,但是北邮的计算机实力一点也不弱,学科评级,计算机是A 北航计算机评级也是A,北理的计算机评级是A- 所以,这三所学校在实力上来说,真的大差…...

面试算法-52-对称二叉树

题目 给你一个二叉树的根节点 root , 检查它是否轴对称。 示例 1: 输入:root [1,2,2,3,4,4,3] 输出:true 解 class Solution {public boolean isSymmetric(TreeNode root) {return dfs(root, root);}public boolean dfs(Tr…...

独立维基和验收测试框架 Fitnesse 入门介绍

拓展阅读 junit5 系列教程 基于 junit5 实现 junitperf 源码分析 Auto generate mock data for java test.(便于 Java 测试自动生成对象信息) Junit performance rely on junit5 and jdk8.(java 性能测试框架。压测测试报告生成。) Fitnesse 完全集成的独立维基和验收测试…...

AI 初创公司趋势:Y Combinator 最新批次的见解

总部位于硅谷的著名创业加速器 Y Combinator (YC) 最近宣布了其 2023 年冬季队列,不出所料,约 31% 的初创公司(269 家中有 80 家)拥有自我报告的 AI 标签。在这篇文章中,我分析了这批 20-25 家初创公司,以了…...

tts语音合成原理

TTS(Text-to-Speech,文本到语音)语音合成技术是一种将文本数据转换为可听见的语音输出的技术。它允许计算机和其他电子设备读出文字信息,使得用户可以通过听的方式接收信息。TTS技术在无障碍服务、智能助手、语音导航、有声读物等…...

轮转数组题解

链接:189. 轮转数组 - 力扣(LeetCode) 这个题目很简单,因为说到了 k 是一个非负数,那么我们就可以 求模的时候就不用考虑的下标还会越界了,往右边 移动 其实就是当前下标 ik ,为了保证它能头尾相接并且不越…...

sqllab第二十四关通关笔记

知识点: 二次注入 先埋一个炸弹,然后通过其他路径引爆它 查看界面发现是一个登录框,尝试进行登录框的注入发现这里不存在注入点 那么就注册一个新的账户吧 通过点击注册,进入注册面板,注册一个新的账户 用户名为 re…...

web前端之多行文本擦除效果、文本逐个显示或展示、创建元素标签、querySelector、createElement、appendChild、requestAnimationFrame

MENU 版本一(requestAnimationFrame)版本二(setTimeout)版本三(css) 版本一(requestAnimationFrame) 前言 window.requestAnimationFrame()告诉浏览器——你希望执行一个动画,并且要求浏览器在下次重绘之前调用指定的回调函数更新动画。该方法需要传入一个回调函数…...

一文解读ISO26262安全标准:功能安全管理

一文解读ISO26262安全标准:功能安全管理 1 安全生命周期1.1 概念阶段1.2 产品开发阶段1.3 生产发布后续阶段 2 安全管理的角色和职责3 安全活动的裁剪4 安全活动的评审5 安全活动的评估6 交付物 下文的表中,一些方法的推荐等级说明: “”表示…...

【华为OD机试】找座位【C卷|100分】

【华为OD机试】-真题 !!点这里!! 【华为OD机试】真题考点分类 !!点这里 !! 题目描述 在一个大型体育场内举办了一场大型活动,由于疫情防控的需要, 要求每位观众的必须间隔至少一个空位才允许落座。 现在给出一排观众座位分布图,座位中存在已落座的观众,请计算出, 在不移…...

LarkXR上新了 | Apollo多终端与XR体验的优化创新

作为领先的数字平行世界产品技术提供方,「Paraverse平行云」一直致力于为企业和开发者提供企业级实时云渲染解决方案。其多终端接入产品LarkXR Apollo,基于底层Runtime技术,实现了在Windows、Linux、MacOS、Android、iOS等多种操作系统下&…...

车载电子电器架构 - 网络拓扑

车载电子电器架构 - 网络拓扑 我是穿拖鞋的汉子,魔都中坚持长期主义的汽车电子工程师 (Wechat:gongkenan2013)。 老规矩,分享一段喜欢的文字,避免自己成为高知识低文化的工程师: 本就是小人物,输了就是输了,不要在意别人怎么看自己。江湖一碗茶,喝完再挣扎,出门靠…...

2024蓝桥杯每日一题(DFS)

备战2024年蓝桥杯 -- 每日一题 Python大学A组 试题一:奶牛选美 试题二:树的重心 试题三:大臣的差旅费 试题四:扫雷 试题一:奶牛选美 【题目描述】 听说最近两斑点的奶牛最受欢迎,…...

Docker 笔记(五)--链接

这篇笔记记录了Docker 的Link。 官方文档: Legacy container links - Communication across links 目录 参考Legacy container linksConnect using network port mappingConnect with the linking systemThe importance of naming Communication across linksEnviro…...

如何处理Android悬浮弹窗双击返回事件?

目录 1 前言 1.1 准备知识 1.2 问题概述 2 解决方案 3 代码部分 3.1 动态更新窗口焦点 3.2 窗口监听返回事件 3.3 判断焦点是否在窗口内部 3.4 窗口监听焦点移入/移出 4 注意事项 4.1 窗口范围 4.2 空隙处的返回事件处理 1 前言 1.1 准备知识 1)开发环…...

高可用篇_A Docker容器化技术_II Docker环境搭建和常见命令

原创作者:田超凡(程序员田宝宝) 版权所有,引用请注明原作者,严禁复制转载 Docker安装 Docker 要求 CentOS7 系统的内核版本在 3.10以上 ,查看本页面的前提条件来验证你的CentOS 版本是否支持 Docker 。 …...

Vue.js+SpringBoot开发食品生产管理系统

目录 一、摘要1.1 项目介绍1.2 项目录屏 二、功能模块2.1 加工厂管理模块2.2 客户管理模块2.3 食品管理模块2.4 生产销售订单管理模块2.5 系统管理模块2.6 其他管理模块 三、系统展示四、核心代码4.1 查询食品4.2 查询加工厂4.3 新增生产订单4.4 新增销售订单4.5 查询客户 五、…...

Python面试笔记

Python面试笔记 PythonQ. Python中可变数据类型与不可变数据类型,浅拷贝与深拷贝详解Q. 解释什么是lambda函数?它有什么好处?Q. 什么是装饰器?Q. 什么是Python的垃圾回收机制?Q. Python内置函数dir的用法?Q…...

springboot 查看和修改内置 tomcat 版本

解析Spring Boot父级依赖 去到项目的根pom文件中&#xff0c;找到parent依赖&#xff1a; <dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-parent</artifactId><version>${springboot.version}…...

nlp_structbert_sentence-similarity_chinese-large入门指南:从ModelScope下载到本地Web服务上线

nlp_structbert_sentence-similarity_chinese-large入门指南&#xff1a;从ModelScope下载到本地Web服务上线 你是不是经常需要判断两句话是不是一个意思&#xff1f;比如&#xff0c;检查用户提问是不是同一个问题&#xff0c;或者看看两段文案是不是在说同一件事。以前做这种…...

ESP-IDF嵌入式类型工具:轻量级字节与位操作库

1. 项目概述 esp_type_utils 是面向 ESP-IDF 生态的轻量级类型工具组件&#xff0c;专为嵌入式底层开发中高频出现的字节级数据操作与字符串格式化需求而设计。它并非 ESP-IDF 官方 SDK 的一部分&#xff0c;而是由开发者 Eric Gionet&#xff08;K0I05&#xff09;维护的开源…...

保姆级教程:用STM32F103C8T6(CUBEMX HAL库)读取航模遥控器PPM信号,附完整代码

低成本STM32F103C8T6读取航模PPM信号实战指南 航模遥控器的PPM信号解析一直是DIY爱好者的热门话题。相比昂贵的专用解码器&#xff0c;一块十几元的STM32F103C8T6开发板就能实现相同功能。本文将手把手教你用最常见的"蓝板"完成从硬件连接到代码调试的全过程。 1. 硬…...

全球化适配:开源工具多语言方案的3大策略与5步落地指南

全球化适配&#xff1a;开源工具多语言方案的3大策略与5步落地指南 【免费下载链接】input-overlay Show keyboard, gamepad and mouse input on stream 项目地址: https://gitcode.com/gh_mirrors/in/input-overlay 在全球化协作日益频繁的今天&#xff0c;开源工具的多…...

EcomGPT-中英文-7B电商模型实战:基于YOLOv8的商品图像识别与文案生成联动

EcomGPT-中英文-7B电商模型实战&#xff1a;基于YOLOv8的商品图像识别与文案生成联动 1. 引言 想象一下这个场景&#xff1a;你正在看一场电商直播&#xff0c;主播语速飞快地介绍着几十款商品。你刚对其中一款水杯产生兴趣&#xff0c;还没来得及问材质和容量&#xff0c;画…...

手机拍照更快了?聊聊MIPI CSI-2的LRTE技术如何优化图像传感器数据传输

手机拍照更快了&#xff1f;揭秘MIPI CSI-2的LRTE技术如何重塑图像传输效率 按下快门的那一刻&#xff0c;你是否曾因手机短暂的"卡顿"而错过精彩瞬间&#xff1f;这背后隐藏着图像传感器与处理器之间数据传输的效率瓶颈。MIPI联盟推出的CSI-2协议最新特性——延迟减…...

BT33F双基二极管的基本特性

简 介&#xff1a; 本文测试了BT33F双基二极管的特性&#xff0c;发现其发射极对两个基极呈现不同导通电压&#xff08;0.86V和1.6V&#xff09;&#xff0c;B1、B2间电阻约13KΩ。实验表明&#xff0c;只有当B1接地、B2接5V电源时&#xff0c;电路才能产生46Hz的振荡信号&…...

eSearch一站式屏幕效率工具安装指南

eSearch一站式屏幕效率工具安装指南 【免费下载链接】eSearch 截屏 离线OCR 搜索翻译 以图搜图 贴图 录屏 万向滚动截屏 屏幕翻译 Screenshot Offline OCR Search Translate Search for picture Paste the picture on the screen Screen recorder Omnidirectional scrolling sc…...

「码动四季·开源同行」go实战案例:如何在 Go 微服务中实现负载均衡?

在上文章中&#xff0c;我们已经介绍了负载均衡的相关概念以及在服务高可用架构中的重要性&#xff0c;也了解了几种主流负载均衡算法的实现。在本文中&#xff0c;我们将在Go微服务实例中具体使用负载均衡技术&#xff0c;并详细说明如何基于服务发现来实现负载均衡的微服务间…...

实战避坑:用Playwright+Selenium绕过电商网站验证码的3种方法(附Python代码)

实战避坑&#xff1a;用PlaywrightSelenium绕过电商网站验证码的3种方法&#xff08;附Python代码&#xff09; 电商平台的反爬虫机制日益复杂&#xff0c;验证码作为核心防线之一&#xff0c;已经从简单的图文识别升级到行为验证、智能风控等多维度拦截。本文将聚焦淘宝、京东…...