JavaScript 把数组扁平化的方法
使用 ES2019中的新特性 Array.prototype.flat()
const arr = [1,2,3,4,[10,20,30]]
const res = arr.flat()
console.info(res) // [1,2,3,4,10,20,30]
使用 reduce, 递归数组
const arr = [1,2,3,4,[10,20,30]]
function flatten(arr){
let res = []
arr.forEach(val=>{
if(val instanceof Array){
res = res.concat(flatten(val))
}else{
res.push(val)
}
})
return res
}
const res = flatten(arr)
console.info(res) // [1,2,3,4,10,20,30]
使用 apply 和 Array.prototype.concat (只能处二维数组转换成一维数组)
- concat的特性: [].concat(1) => [1]; [].concat([1,2,3]) => [1,2,3]
如果concat的val是数组就等于该数组,如果是单个值,则为[val] - 原理:
apply方法会调用一个函数, - 第一个参数会作为被调用函数的
this值 - 第二个参数(一个数组 或者 类数组对象)作为被调用对象的
arguments值 也就是说该数组的各个元素会依次成为北调用函数的各个参数
const children = [[1,2],3,4]
const v = ['a','b','c']
const b = Array.prototype.concat.apply(v, children)
console.info(b) // ["a", "b", "c", 1, 2, 3, 4]
JavaScript 把数组扁平化的方法的更多相关文章
- 面试官:JavaScript如何实现数组拍平(扁平化)方法?
面试官:JavaScript如何实现数组拍平(扁平化)方法? 1 什么叫数组拍平? 概念很简单,意思是将一个"多维"数组降维,比如: // 原数组是一个"三维" ...
- JavaScript数组常用方法解析和深层次js数组扁平化
前言 数组作为在开发中常用的集合,除了for循环遍历以外,还有很多内置对象的方法,包括map,以及数组筛选元素filter等. 注:文章结尾处附深层次数组扁平化方法操作. 作为引用数据类型的一种,在处 ...
- javascript中数组的22种方法
× 目录 [1]对象继承 [2]数组转换 [3]栈和队列[4]数组排序[5]数组拼接[6]创建数组[7]数组删改[8]数组位置[9]数组归并[10]数组迭代[11]总结 前面的话 数组总共有22种方法 ...
- javascript中数组的22种方法 (转载)
前面的话 数组总共有22种方法,本文将其分为对象继承方法.数组转换方法.栈和队列方法.数组排序方法.数组拼接方法.创建子数组方法.数组删改方法.数组位置方法.数组归并方法和数组迭代方法共10类来进行详 ...
- javascrip的数组扁平化
扁平化 数组的扁平化,就是将一个嵌套多层的数组 array (嵌套可以是任何层数)转换为只有一层的数组. 举个例子,假设有个名为 flatten 的函数可以做到数组扁平化,效果就会如下: var ar ...
- JS: 数组扁平化
数组扁平化 什么是数组扁平化? 数组扁平化就是将一个多层嵌套的数组 (Arrary) 转化为只有一层. // 多层嵌套 [1, 2, [3, 4]] // 一层 [1, 2, 3, 4] 递归实现 思 ...
- js技巧-使用reduce实现更简洁的数组对象去重和数组扁平化
Array.prototype.reduce()方法介绍: 感性认识reduce累加器: const arr = [1, 2, 3, 4]; const reducer = (accumulator, ...
- JS数组专题1️⃣ ➖ 数组扁平化
一.什么是数组扁平化 扁平化,顾名思义就是减少复杂性装饰,使其事物本身更简洁.简单,突出主题. 数组扁平化,对着上面意思套也知道了,就是将一个复杂的嵌套多层的数组,一层一层的转化为层级较少或者只有一层 ...
- js多维数组扁平化
数组扁平化,就是将多维数组碾平为一维数组,方便使用. 一:例如,一个二维数组 var arr = ['a', ['b', 2], ['c', 3, 'x']],将其扁平化: 1. 通过 apply ...
随机推荐
- OSCP Learning Notes - Capstone(1)
Kioptrix Level 1.1 Walkthrough Preparation: Download the virtual machine from the following website ...
- 使用PowerShell自动编译部署前端
前言 最近在开发一套管理系统,做了前后端分离. 后台使用的是Asp.Net Core 3.1 前端使用的是Vue+Ant Design 自己搞了一台云服务器,打算把系统部署到云服务器上.以供外网访问. ...
- Vue开发者必会的基础知识盘点
你会Vue吗,你看以下知识点你掌握了多少?实际工作中是否运用的得心应手?如果是,那么恭喜你! Vue中的数据和DOM已经被关联起来,所有的东西都是响应式的.注意我们不再和HTML直接交互.一个Vue应 ...
- finalize()和四种引用的一点思考
一次对ThreadLocal的学习引发的思考 ThreadLocal对Entry的引用是弱引用,于是联想到四种引用的生命周期. 强引用,不会进行垃圾回收 软引用,JVM内存不够,进行回收 弱引用,下次 ...
- 关于简单的数据双向绑定原理,defineProperty 和Proxy演示
双向绑定,也就是说js中的数据传到页面,页面中的内容到js,实现同步更新,简单的演示可以直接复制下放HTML代码运行. 在这个例子中,我们使用defineProperty ,Object.define ...
- 郭的手机出现提示:条码扫描器,抱歉,Android相机出现问题。您可能需要重启设备
郭的手机出现提示:条码扫描器,抱歉,Android相机出现问题.您可能需要重启设备 ++++++++++++++++++ 原因是系统没有给应用使用摄像头的权限,我到楼下设置对方手机,选择“设置”-&g ...
- 详解 awk '/^tcp/ {++S[$NF]} END {for(a in S) print a, S[a]}每个字段的意思
用这个列子说好了如果NF代表字段 那最后应该是7 才对啊 还有最后怎么都是1呢?END前面的是查看并发吧 后面是查看 tcp连接数 是这样吗? awk下标采用字符串来表示可能你在其它语言见 ...
- shell 格式化数据,转换为execl
awk ' BEGIN { OFS="\t"} ;{ $1=$1 ; print $8,$NF} ' >/root/log/aa.xlsx awk ' BEGIN { O ...
- Laravel 使用阿里云 oss 存储对象
一.下载安装 composer require jacobcyl/ali-oss-storage 二.注册服务提供者 在config/app.php的providers下添加: //阿里云OSS对象存 ...
- WSGI应用程序示例
import time # WSGI允许开发者自由搭配web框架和web服务器 def app(environ,start_response): status = '200 OK' response_ ...