专栏首页Krryblog嵌套数组的合并,扁平化数组
原创

嵌套数组的合并,扁平化数组

博客地址:https://ainyi.com/19

问题引入

请写一个 flat 方法,实现扁平化嵌套数组

对于 [ [], [], [], ...] 数组里嵌套数组,有个需求:将里面的数组元素都放到外层数组,变成 , , , ...

例如:let arr = 1, 2, 3, 4, 5, 6, 7, 8, 9;

变成:arr = 1, 2, 3, 4, 5, 6, 7, 8, 9;

倒是有几种方法:

// 模拟:执行内含 10000 子数组 + 子数组有 13 个元素的数组
let arr = [];

for (let i = 0; i < 10000; i++) {
  arr.push([Math.random()*100, Math.random()*100, Math.random()*100, Math.random()*100, Math.random()*100, Math.random()*100, Math.random()*100, Math.random()*100, Math.random()*100, Math.random()*100, Math.random()*100, Math.random()*100, Math.random()*100]);
}

// 1. toString、split、map (支持多维数组~~~写法简便,速度又快)
// 全部是数字类型,重新映射 map,不是字符串类型就不用 map
// 用时:0.246s
let newArr = [];
let nowTime = new Date();
newArr = arr.toString().split(',').map(item => +item);
console.log(new Date() - nowTime, 'toString、split、map');

// 全部数字类型的:arr.toString().split(',').map(Number); 
// 全部字符串类型的:arr.toString().split(','); 



// 2. reduce + concat,(数组元素较短时推荐,写法简便)
// 用时:5.7s
newArr = [];
nowTime = new Date();
// 默认指定第一次的prev为[]
newArr = arr.reduce((arr, cur) => arr.concat(cur), []);
console.log(new Date() - nowTime, 'reduce');


// 3. 双重循环push,(数组元素较长时推荐,速度最快)
// 数组里面每个元素都必须是数组才行
// 诸如这样 [[],[],[],[]] 才行,如果这样 [1,[],2,[]] 不行,因为 for of 不能循环数字
// 用时:0.018 s
newArr = [];
nowTime = new Date();
for (let va of arr) {
  for (let vq of va) {
    newArr.push(vq);
  }
}
console.log(new Date() - nowTime, 'for');


// 4. concat
// 用时:3.4 s
newArr = [];
nowTime = new Date();
for (let va of arr) {
  newArr = newArr.concat(va);
}
console.log(new Date() - nowTime, 'concat');

// 5. es6 的深拷贝数组 (速度最慢)
// 数组里面每个元素都必须是数组才行
// 诸如这样 [[],[],[],[]] 才行,如果这样 [1,[],2,[]] 不行,因为 ...后接不能是数字
// 用时:34 s
newArr = [];
nowTime = new Date();
for (let va of arr) {
  newArr = [...newArr, ...va];
}
console.log(new Date() - nowTime, 'es6');

多维数组

let arr = [1, [[2], [3, [4]], 5], [11, [21, [22, 22.1, 22.3], 31], 33, 40]];
let newArr = [];

// toString、split、map (写法简便)
// 注意:数组元素非数字的时候不需要 map
newArr = arr.toString().split(',').map(item => +item);
console.log(newArr);

// reduce 递归写法
let flattenDeep = (arr) => Array.isArray(arr) ? arr.reduce( (a, b) => [...flattenDeep(a), ...flattenDeep(b)] , []) : [arr];
newArr = flattenDeep(arr);
console.log(newArr);

数组的深拷贝

// Array.from()
var arr1 = [1,2,3];
var arr2 = Array.from(arr1);
// 数组尾部添加
arr2.push(100);
console.log(arr1,arr2); // [1, 2, 3] [1, 2, 3, 100]

// [...arr] 使用这个也可以拼接数组,但是不推荐,效率太低
var arr1 = [1,2,3];
// 超引用拷贝数组
var arr2 = [...arr1];
// 数组尾部添加
arr2.push(1000);
console.log(arr1,arr2); // [1, 2, 3] [1, 2, 3, 1000]

function show(...args){
// 此时这个形式参数就是一个数组,我们可以直接push东西进来,如下
args.push(5);
console.log(args);
}
// 调用
show(1,2,3,4); // [1, 2, 3, 4, 5]

博客地址:https://ainyi.com/19

原创声明,本文系作者授权云+社区发表,未经许可,不得转载。

如有侵权,请联系 yunjia_community@tencent.com 删除。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • Vue 自定义指令

    除了核心功能默认内置的指令 (v-model 和 v-show),Vue 也允许注册自定义指令。注意,在 Vue2.0 中,代码复用和抽象的主要形式是组件。然而...

    Krry
  • JavaScript 数组去重

    解决方案有很多,可以是两个 for 循环,或者一个 for 和 一个 filter,一个 filter 和 一个 every,接下来介绍这几种方法:

    Krry
  • java map遍历、排序,根据value获取key

    若要取 map 中 value 的最大值 或 与之对应的 key(整型或浮点型):可利用list

    Krry
  • JavaScript数据结构04 - 链表

    前面我们学习了数组这种数据结构。数组(或者也可以称为列表)是一种非常简单的存储数据序列的数据结构。在这一节,我们要学习如何实现和使用链表这种动态的数据结构,这意...

    liuxuan
  • 现场报道 | 面对最菜TI战队,OpenAI在Dota2上输的毫无还手之力

    据介绍,本届 TI8 的很多参赛队伍都报名想参加与 AI 的比赛,OpenAI 今天遇到了第一个对手:来自巴西的战队 paiN,后者也是本届 TI8 比赛第一支...

    机器之心
  • 教程笔记《JavaScript深入浅出》

    一、数据类型 javascript是弱数据类型语言,不需要显式的定义类型,一共有如下六种数据类型 五种基本类型:number,string,boolean,nu...

    小古哥
  • OpenAI公开Dota 2论文:胜率99.4%,「手术」工具连续迁移训练

    人工智能的长期目标是解决高难度的真实世界难题。为了实现这一目标,研究者在近几十年的时间里将游戏作为研究 AI 发展的基石。从双陆棋(1992)到国际象棋(199...

    机器之心
  • python-网络编程

      socket 的原意是“插座”,在计算机通信领域,socket 被翻译为“套接字”,它是计算机之间进行通信的一种约定或一种方式。通过 socket 这种约定...

    yaohong
  • HTTP/3 原理实战

    ? 作者:billpchen,腾讯看点前端开发工程师 2015 年 HTTP/2 标准发表后,大多数主流浏览器也于当年年底支持该标准。此后,凭借着多路复用、头...

    腾讯技术工程官方号
  • 构建不重复特殊数组

    原理非常简单,set 里面是不能有重复内容的。所以先转成 set 再转成 list 即可实现去重。

    FungLeo

扫码关注云+社区

领取腾讯云代金券