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 ...
随机推荐
- Ethical Hacking - NETWORK PENETRATION TESTING(21)
MITM - Code Injection Inject javascript or HTML code into pages. Code gets executed on target machin ...
- 尝鲜刚发布的 SpringFox 3.0.0,以前造的轮子可以不用了...
最近 SpringFox 3.0.0 发布了,距离上一次大版本2.9.2足足有2年多时间了.可能看到这个名字,很多读者会有点陌生.但是,只要给大家看一下这两个依赖,你就知道了! <depende ...
- 为什么在SpringBoot+maven的项目中,所引入的依赖包可以不指定依赖的版本号?
当在Springboot项目中引入了spring-boot-starter-parent,则可以不用引入依赖包版本号,比如: <parent> <groupId>org.spr ...
- js 判断传入参数是域名还是地址
var get = function(url) { if(location.protocol === "http") { return url; } var reg = /^(ht ...
- 小书MybatisPlus第6篇-主键生成策略精讲
本文为mybatis系列文档的第6篇,前5篇请访问下面的网址. 小书MybatisPlus第1篇-整合SpringBoot快速开始增删改查 小书MybatisPlus第2篇-条件构造器的应用及总结 小 ...
- Apache常用配置详解
Apache配置文件:conf/httpd.conf.(注意:表示路径时使用‘/’而不使用‘\’,注释使用‘#’) 1. ServerRoot:服务器根目录,也就是Apache的安装目录,其他的目录配 ...
- IO—》字节流&字符流
字节流 一.字节输出流OutputStream OutputStream此抽象类,是表示输出字节流的所有类的超类.操作的数据都是字节,定义了输出字节流的基本共性功能方法. FileOutputStre ...
- timeit_list操作测试
''' timeit库Timer函数 ''' from timeit import Timer def test1(): l = list(range(1000)) def test2(): l = ...
- pandas_处理异常值缺失值重复值数据差分
# 处理异常值缺失值重复值数据差分 import pandas as pd import numpy as np import copy # 设置列对齐 pd.set_option("dis ...
- 《闲扯Redis九》Redis五种数据类型之Set型
一.前言 Redis 提供了5种数据类型:String(字符串).Hash(哈希).List(列表).Set(集合).Zset(有序集合),理解每种数据类型的特点对于redis的开发和运维非常重要. ...