ES6中将多维数组转换为一维数组之flat()

最新推荐文章于 2023-12-12 11:26:17 发布
最新推荐文章于 2023-12-12 11:26:17 发布
阅读量9.2k 收藏 12
点赞数 6
分类专栏： JavaScript 文章标签： flat() 多维数组 join() toString() split()
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/syleapn/article/details/98772840
版权
本文介绍了如何在JavaScript中使用ES6的flat()方法将多维数组转换为一维数组，避免了join()和split()方法导致的数据类型变化。详细解释了flat()方法的特性，包括它如何保持数组成员类型不变、默认只拉平一层及可接受参数以处理多层嵌套，还提到了flatMap()方法作为补充。
摘要由CSDN通过智能技术生成

JavaScript中如何将嵌套的数组"拉平"变成一维数组?这个功能在实际项目中，还是用到的比较多。实际项目中也遇到过，所以

今天就在这里做个总结，方便后续拓展~

看到网上好多资料是通过join() / oString()方法结合split()方法进行转换，但是这样最终得到的是一个字符串数组。有时我们原

本的数组成员并不是字符串类型的。不想处理后改变数组成员类型。那此时我么可以用ES6中给出的手段去解决->既不会改变数

组成员类型，又简单高效。走起吧!!!

举例说明：

先看常用的处理方式吧，如下：

let arr1 = [1,2,[3,[4]]];
let arr2 = arr1.toString().split(',');  // ["1", "2", "3", "4"]
let arr3 = arr1.join().split(',');   // ["1", "2", "3", "4"]

上述代码缺点：数组每一项都成字符串了。

说明：虽然有时我们需要处理成这种字符串数组，但是有时也并不想要这种结果，面对这个，解决的方案有：

1、ES5中的处理手段：<

最低0.47元/天 解锁文章
Syleapn
关注
专栏目录
es6 filter() 数组过滤方法总结
10-17
在ES6标准中，JavaScript数组新增了filter()方法，用于过滤数组元素并返回一个包含通过测试的所有元素的新数组。这个方法不会改变原数组，而是返回一个新数组，其中包含使提供的函数返回true的所有元素。 1. **基本...
es6方法：多维数组转一维数组
monkey_xiaoda的博客
08-26 1074
方法：flat()；可接受参数2,3,4.....,Infinity； 用法如下： const a = [1, 2, 3, 4, 3]; const b = [3, 4, [5, 6]]; const c = [3, 4, [5, 6, [7, 8]]]; // 不传默认是二维数组降一维数组 console.log(a.concat(b).flat()); // 打印为[1, 2, 3, 4, 3, 3, 4, 5
es6将二维多维数组转化为一维数组
Lguorong的博客
04-22 2517
扁平化数组Array.prototype.flat()方法 使用方法总结 1. Array.prototype.flat() 用于将嵌套的数组“拉平”，变成一维的数组。该方法返回一个新数组，对原数据没有影响。 const abc = [1, 2, [3, 4,]] console.log(abc.flat()) // [ 1, 2 ,3 ,4 ] 2. 不传参数时，默认“拉平”一层，可以传入一个整数，表示想要“拉平”的层数。 const abc = [1, 2, [3, 4, [5, 6.
多维数组转一维数组
weixin_43545329的博客
05-16 563
方法一(es6实现) var arr1 = [[0, 1], [2, 3], [4, 5]]; function flatten(arr) { return [].concat( ...arr.map(x => Array.isArray(x) ? flatten(x) : x) ) } var arr2 = flatten(arr1); // arr2 [0, 1, 2, 3, 4, 5]...
js把多维数组转换成一维数组
最新发布
lxc的点点滴滴
12-12 856
多维数组转化为一维数组
多维数组转一维数组 6种方法
luoyumei的博客
08-13 2381
join+split var arr=[[1,2],3,[4,[5]]]; var arr1=arr.join().split(','); console.log(arr1);//[&amp;amp;amp;quot;1&amp;amp;amp;quot;, &amp;amp;amp;quot;2&amp;amp;amp;quot;, &amp;amp;amp;quot;3&amp;amp;amp;quot;, &amp;amp;amp;qu
多维数组变成一维数组
m0_63026408的博客
06-29 233
flat方法默认没有参数，这时只会降维降一层。可以传数字类型的参数指定降维次数。如果想将任意维度的数组变成一位数组，可以传入Infinity。flat方法不改变原数组。
js代码-数组拍平：将多维数组转化为一维
07-14
在JavaScript中，数组拍平（Flattening）是一种常见的操作，尤其在处理嵌套数据结构时，例如将多维数组转换为一维数组。这样的需求通常出现在数据分析、数据处理或某些算法实现中。本篇文章将深入探讨如何使用...
ES6基础之数组和对象的拓展实例详解
10-16
- **将类数组对象转换为数组**：利用拓展运算符，可以将拥有length属性的对象转换为真正的数组。 #### 2. Array.from() `Array.from()` 方法用于将类数组对象或者可遍历对象转换为真正的数组。它还可以接受一个函数...
浅谈ES6新增的数组方法和对象
08-29
ES6新增的数组方法和对象 ES6中新增了许多实用的数组方法和对象，下面我们将逐一介绍这些新增的方法和对象。 首先，ES6中新增了遍历数组的方法，使用for...of语句可以遍历数组或对象。例如： ``` let arr = [1, 2,...
js把多维数组转换成一维数组的方法
2301_77209411的博客
05-03 1337
flat()默认是拉平一层，但是要想拉平多层且我们不知道该数组的是几维数组时，我们可以用Infinity作为参数，可以实现多维数组转换为一维数组。但是要注意，因为flat（）方法为es6的方法，在平时写代码时要注意有些手机对于es6的代码时不支持的，需要编译的，切忌踩这个坑。上面的方法是使用apply结合concat，缺点是只能将二维转一维，多维数组就有问题了。由上面的例子可以看出，改方法对三维数组的转换时失败的；方法一：apply结合concat拉平数组。方法二：使用es6的flat()方法。
初始化二维、一维数组 ＋es6新增的三个方法new Set、Array.from() 、new Map()＋获取数组中最小值的四种方法＋对象的四种遍历方法+sort()方法
m0_52669454的博客
08-16 2244
初始化二维、一维数组 ＋es6新增的两个方法new Set、Array.from() ＋获取数组中最小值的四种方法＋对象的四种遍历方法+sort()方法
多维对象数组转化为一维数组，简单易懂，拍平数组flatten
weixin_40618068的博客
03-21 4485
首先我们先提出需求，方法总在需求中来，例如现在需要实现图书多级目录的缩进效果，而后端那群大佬给我们的数据长这个样子 var arr = [ { id:1, title:'我是1目录', subitems: [ { id: 11, title:'我是1-1目录', subitems:[ { id:111, title: '...
flat()方法将多维数组变为一维数组，扁平化数组
qq_42238554的博客
04-02 709
flat() 将二维数组转换为一维数组。 flat() 方法会按照一个可指定的深度递归遍历数组，并将所有元素与遍历到的子数组中的元素合并为一个新数组返回。 flat除了有扁平化嵌套数组之外还可以扁平化空项。 实例,将一个二维数组转换为一维数组： let arr=[1,2,[3,4],[5,8],9]; let arrnew=arr.flat(); console.log(arrnew); //输出结果：[1, 2, 3, 4, 5, 8, 9] 实例，使用Infinity将多层次深度数组转换为一维数组 l
ES6之数组的flat(Infinity)扁平化，实现多维数组转成一维数组
GuAng
12-28 816
let arr= [1,2,[[3,4],[5,6]]] console.log(arr.flat(Infinity)); // [ 1, 2, 3, 4, 5, 6 ] console.log(arr.flat()); // [ 1, 2, [3,4],[5,6] ] console.log(arr.flat(1)); // [ 1, 2, [3,4],[5,6] ] console.log(arr.flat(2)); // [ 1, 2, 3, 4, 5, 6 ]
js ES6之数组的flat(Infinity)扁平化，可以实现多维数组转成一维数组
u014645827的博客
07-21 656
js ES6之数组的flat(Infinity)扁平化，可以实现多维数组转成一维数组
es6中的flat方法，可以把多维数组摊平成一维
Tangoneone的博客
08-16 1020
// 返回新数组对原数组没有影响，flat（）默认摊平一层 [5,6,[7,8]].flat() // [5,6,7,8] // 默认摊平一层 [1,2,[3,[4,5]]].flat() // [1,2,3,[4,5]] // 想摊平多层就将flat()方法的参数写出一个整数，表示想要拉平的层数 [1,2,[3,[4,5]]].flat(2) //[1,2,3,4,5] // 不管多少层嵌套数组， 都只想转成一维数组， 可以用infinity关键字作为参数 [1,[2,3,[4]]].flat(i
es6常用数组操作及技巧汇总
热门推荐
李帅帅笔记
05-21 1万+
1. array.concat(array1, array2,...arrayN);合并多个数组，返回合并后的新数组，原数组没有变化。const array = [1,2].concat(['a', 'b'], ['name']); // [1, 2, "a", "b", "name"]2. array.every(callback[, thisArg]);检测数组中的每一个元素是否都通过了cal...
es6一维数组转二维数组
06-03
可以使用ES6中的`Array.from()`方法和`Array.slice()`方法将一维数组转换为二维数组。具体实现如下： ```javascript const arr1 = [1, 2, 3, 4, 5, 6]; const row = 2; const col = 3; const arr2 = Array.from({ length: row }, (_, rowIndex) => arr1.slice(rowIndex * col, rowIndex * col + col) ); console.log(arr2); // Output: [[1, 2, 3], [4, 5, 6]] ``` 其中，`Array.from()`方法可以将类数组对象或可迭代对象转换成一个新的数组实例。第一个参数是一个类数组对象或可迭代对象，第二个参数是一个映射函数，用于对每个元素进行处理。在这个例子中，第一个参数是一个包含两个元素的数组，长度为`row`，第二个参数是一个映射函数，它的第一个参数是元素的值，第二个参数是元素的索引。`arr1.slice(rowIndex * col, rowIndex * col + col)`用于取出一段长度为`col`的数组，从而将一维数组转换成二维数组。
评论 3
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值