你不知道的JavaScript数组扁平化五种方法

Yelena ·
更新时间:2024-09-21
· 829 次阅读

JavaScript数组扁平化

对于下边这个深层嵌套数组,我们在某些环境可能需要将它进行扁平化(转换为一维数组),比如评论系统种,评论数据可能就会深层嵌套。所以我给大家带来了下边几种方法。

let arr = [1, [2, 3, 4], [3, 5, [1, [4]]]]; 1. ES6中Array.prototype.flat()函数

对兼容性要求较高,不兼容ie,且要求node版本11以上。

执行时间:0.190ms (nodejs版本12.16.1)

arr.flat(Infinity); // [1, 2, 3, 4, 3, 5, 1, 4] 2. 转换为字符串方法

toString()方法直接转换为不带"[]"的字符串,通过split()方法分割为数组,最后循环将每一个字符串元素转换为数字类型

执行时间:0.156ms

arr.toString().split(',').map(item=>parseFloat(item)); // [ 1, 2, 3, 4, 3, 5, 1, 4 ]

使用JSON.stringify()方法转换为带"[]“的字符串,然后通过replace+正则去掉”[]"

执行时间:0.391ms

JSON.stringify(arr).replace(/[\[\]]/g, '').split(',').map(item=>parseFloat(item)); // [ 1, 2, 3, 4, 3, 5, 1, 4 ] 3. 循环验证数组元素是否为数组

[].concat(...arr)可以展开一层数组

执行时间:0.246ms

while(arr.some(item=> Array.isArray(item))){ arr = [].concat(...arr); } // [ 1, 2, 3, 4, 3, 5, 1, 4 ] 4. eval()+模板字符串函数

执行时间:0.124ms

eval(`[${arr}]`); // [ 1, 2, 3, 4, 3, 5, 1, 4 ] 5. 递归

执行时间:0.209ms

function myflat(arr){ let newArr = []; let flat = (arr)=>{ for(let i=0; i<arr.length; i++){ if(Array.isArray(arr[i])){ newArr.concat(flat(arr[i])); continue; } newArr.push(arr[i]); } return newArr; } return flat(arr); } myflat(arr); // [ 1, 2, 3, 4, 3, 5, 1, 4 ]
作者:fuux



javascript数组 扁平化 方法 JavaScript

需要 登录 后方可回复, 如果你还没有账号请 注册新账号
相关文章