JS数组扁平化_扁平化js

JS数组扁平化_扁平化jsJS 扁平化 (flatten) 数组

大家好,又见面了,我是你们的朋友全栈君。

前言

数组是 JS 中使用频率仅次于对象的数据结构,官方提供了众多的 API,谈谈如何扁平化(flatten)数组。

数组的扁平化,是将一个嵌套多层的数组 array (嵌套可以是任何层数)转换为只有一层的数组

flat

flat(depth) 方法会递归到指定深度将所有子数组连接,并返回一个新数组, depth指定嵌套数组中的结构深度,默认值为1,不管多少层则可以用Infinity关键字作为参数

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

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

[1, 2, [3, [4, [5]]]].flat(Infinity) // [1, 2, 3, 4, 5]
复制代码

flat()有兼容性问题, 不建议使用

reduce

function flatten(arr) {
  return arr.reduce((a, b) => {
    // return Array.isArray(b) ? a.concat(flatten(b)) : a.concat(b);
    return a.concat(Array.isArray(b) ? flatten(b) : b);
  }, []);
};

// es6
const flatten = arr =>
  arr.reduce((a, b) => a.concat(Array.isArray(b) ? flatten(b) : b), []);


flatten([1,[2,3],4,[[5,6],7]])  // [1, 2, 3, 4, 5, 6, 7]
复制代码

toString

只适于数组的元素都是数字

function flatten(arr) {
  return arr.toString().split(",").map(item => +item);
};


flatten([1,[2,3],4,[[5,6],7]])  // [1, 2, 3, 4, 5, 6, 7]
复制代码

[].concat(…arr)

function flatten(arr) {
  return !Array.isArray(arr) ? arr : [].concat.apply([], arr.map(flatten));
}


flatten([1,[2,3],4,[[5,6],7]])  // [1, 2, 3, 4, 5, 6, 7]
复制代码

generator

function* flatten(arr) {
  if (!Array.isArray(arr)) yield arr;
  else for (let el of arr) yield* flatten(el);
}

let flattened = [...flatten([1,[2,[3,[4]]]])];  // [1, 2, 3, 4]
复制代码

字符串过滤

将输入数组转换为字符串并删除所有括号([])并将输出解析为数组

const flatten = arr => JSON.parse(`[${ 
     JSON.stringify(arr).replace(/\[|]/g,'')}]`);
复制代码

undercore or lodash 库

使用undercore库或者lodash的中_.flatten函数,具体用法查阅API文档

_.flatten([1, [2], [3, [[4]]]]);
=> [1, 2, 3, 4];
复制代码

参考文献

实现扁平化(flatten)数组的方法还有很多种,可以参考一下文献

  1. javascript-flattening-an-array-of-arrays-of-objects

  2. merge-flatten-an-array-of-arrays-in-javascript

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

发布者:全栈程序员-用户IM,转载请注明出处:https://javaforall.cn/107000.html原文链接:https://javaforall.cn

【正版授权,激活自己账号】: Jetbrains全家桶Ide使用,1年售后保障,每天仅需1毛

【官方授权 正版激活】: 官方授权 正版激活 支持Jetbrains家族下所有IDE 使用个人JB账号...

(0)


相关推荐

  • 计算机清理垃圾代码,你也可以写代码系列,一键清除系统垃圾文件的代码(超简单)-清除垃圾文件…

    计算机清理垃圾代码,你也可以写代码系列,一键清除系统垃圾文件的代码(超简单)-清除垃圾文件…电脑使用久了,系统或者软件就会产生大量的日志文件、临时文件等垃圾文件。这些垃圾文件日积月累,不仅会大量占用磁盘空间,也会严重拖慢系统运行速度。所以定时清理垃圾文件十分有必要。我们可以手动删除,也可以借助本文提供的批处理自动删除。1,创建一个清除垃圾的.bat文件(1)在桌面上单击鼠标右键,选择“新建”选择“文本文档”(2)将新建的文件改名为“垃圾文件清除.bat”(注意.txt后缀要记得删掉)…

  • Sublime Text 3 注册/激活方法

    Sublime Text 3 注册/激活方法Sublime是一款很好用的编辑器,虽然是免费使用,但是经常会弹出吆喝着让你购买(purchase)的弹窗,对一名优秀的强迫症来说看久了还是很烦人的。而且现在网上很多注册码都不可用。那么要怎么解决呢?下面提供两种解决方案。(我是在win10系统上操作的)二、方案方案一[1]1)建立一个bat文件(随便取个名字,如“runHost.bat”),复制以下代码到…

  • 常用的.net开源项目「建议收藏」

    常用的.net开源项目「建议收藏」Json.NEThttp://json.codeplex.com/Json.Net是一个读写Json效率比较高的.Net框架.Json.Net使得在.Net环境下使用Json更加简单。通过LinqToJSON可以快速的读写Json,通过JsonSerializer可以序列化你的.Net对象。让你轻松实现.Net中所有类型(对象,基本数据类型等)和Json的转换。

  • awvs扫描器原理_条形码扫描器现在无法使用

    awvs扫描器原理_条形码扫描器现在无法使用AWVSAWVS(WebVulnerabilityScanner)是一个自动化的Web应用程序安全测试工具,它可以扫描任何可通过Web浏览器访问的和遵循HTTP/HTTPS规则的Web站点和Web应用程序。适用于任何中小型和大型企业的内联网、外延网和面向客户、雇员、厂商和其它人员的Web网站。WVS可以通过检查SQL注入攻击漏洞、XSS跨站脚本攻击漏洞等漏洞来审核Web应用程序的安全性。AWVS功能介绍WebScanner:核心功能,web安全漏洞扫描(深度,宽度,限制20个)Site

  • siamfc代码解读_每日一文:目标跟踪(SiamFC)「建议收藏」

    siamfc代码解读_每日一文:目标跟踪(SiamFC)「建议收藏」Fully-ConvolutionalSiameseNetworksforObjectTracking.arXiv:1606.09549v2主体结构:核心CNN是AlexNet,去掉padding和全连接层FC,加入BN层,改为全卷积网络FCN,控制stride为8。FCN部分作用相当于特征提取,会得到与输入图像分辨率相关,通道数128的featuremap,类似与常用fHOG特征(h…

  • linux使用ps命令查看和控制进程_shell查看进程

    linux使用ps命令查看和控制进程_shell查看进程ps命令Linuxps(英文全拼:processstatus)命令用于显示当前进程的状态,类似于windows的任务管理器查看所有进程ps-A显示所有进程信息,连同命令行ps-

发表回复

您的电子邮箱地址不会被公开。

关注全栈程序员社区公众号