【前端学习】—多种方式实现数组拍平(十一)

简介: 【前端学习】—多种方式实现数组拍平(十一)

一、数组拍平

数组拍平也叫数组扁平化、数组拉平、数组降维,指的是把多维数组转化为一维数组。

二、使用场景

复杂场景下的数据处理(echarts做大屏数据展示)

三、如何实现数组拍平

四、代码演示

const array =[1,2,3,4,[5,6],[7,8]];
//reduce实现
function flatten(array){
    return array.reduce(function(prev,current){
        return prev.concat(Array.isArray(current)?flatten(current):current)
    },[])
}
const result=flatten(array);
console.log(`result`,result);//result [1, 2, 3, 4,5, 6, 7, 8]
//flat实现
function flatten(array){
    return array.flat(Infinity);
}
const result1=flatten(array)
console.log(`result1`,result);//result1 [1, 2, 3, 4,5, 6, 7, 8]
//while函数
function flatten(array){
    while(array.some(Array.isArray)){
        array=[].concat(...array)
    }
    return array;
}
const result2=flatten(array);
console.log(result2);// [1, 2, 3, 4,5, 6, 7, 8]


相关文章
|
2月前
|
前端开发 JavaScript 开发者
从零开始学习前端开发
前端开发是目前互联网行业中最为热门的职业之一。本文将介绍从零开始学习前端开发所需的基础知识和技能,包括HTML、CSS、JavaScript等方面的内容,并提供了一些实践性的建议和学习资源,帮助初学者快速入门。
89 1
|
3月前
|
前端开发 JavaScript
从零开始学习前端开发
前端开发是当前最热门的技术之一。本文将从零开始,详细介绍前端开发的基础知识和实践技巧,为初学者提供全面的学习指南。
30 0
|
3月前
|
设计模式 前端开发 算法
No210.精选前端面试题,享受每天的挑战和学习
No210.精选前端面试题,享受每天的挑战和学习
No210.精选前端面试题,享受每天的挑战和学习
|
3月前
|
消息中间件 缓存 前端开发
No209.精选前端面试题,享受每天的挑战和学习
No209.精选前端面试题,享受每天的挑战和学习
No209.精选前端面试题,享受每天的挑战和学习
|
3月前
|
前端开发 JavaScript Java
No208.精选前端面试题,享受每天的挑战和学习
No208.精选前端面试题,享受每天的挑战和学习
No208.精选前端面试题,享受每天的挑战和学习
|
2月前
|
存储 开发框架 前端开发
从零开始学习前端开发
前端开发是现代互联网应用程序开发中不可或缺的一部分。本文将带您从零开始学习前端开发,包括HTML、CSS和JavaScript等核心技术,以及常见的开发框架和工具。
|
3月前
|
Web App开发 前端开发 JavaScript
从零开始学习前端开发
在当今数字化时代,前端开发人员的需求越来越高。本文将介绍从零开始学习前端开发所需学习的技能和工具,以及如何将这些知识应用到实际项目中。
|
3月前
|
前端开发 JavaScript 开发工具
从零开始学习前端开发技术
随着互联网的快速发展,前端开发成为了一个备受关注的职业。本文将从零开始介绍前端开发所需的基础知识和技能,并重点介绍常用的HTML、CSS和JavaScript语言,帮助初学者快速入门前端开发。
36 0
|
3月前
|
存储 JSON 前端开发
No206.精选前端面试题,享受每天的挑战和学习
No206.精选前端面试题,享受每天的挑战和学习
No206.精选前端面试题,享受每天的挑战和学习
|
20天前
|
前端开发 JavaScript Java
通过学习mayfly,我学会了前端如何优雅设计字典值
`shigen`是一位擅长多种编程语言的博主,他在探索[mayfly-go](https://juejin.cn/post/7319365035552309248)项目后,发现了对枚举值管理的优雅设计。他分享了如何将字典和枚举值结构化,使用Vue+typescript实现更易维护的代码。通过创建`TagType`和`EnumValue`类,以及提供静态方法,实现了模块化和简洁的字典处理。示例展示了如何在页面中高效引用和显示字典数据,提高了代码的可读性和可维护性。
17 3
通过学习mayfly,我学会了前端如何优雅设计字典值