前端学习-JavaScript每日一题-数组扁平化

数组扁平化问题描述

数据扁平化，指把多维数组变成一维数组

即原始数组：[1,[2,[3,[4,5]]]]

经过扁平化后：[1,2,3,4,5]

数组扁平化的具体方法

数组扁平化实现起来并不复杂，涉及很简单的算法，还可以通过一些JS数组自带的方法实现

使用flat方法实现数组扁平化

Array.flat(depth)
depth参数可选，默认为1，表示数组扁平化的层数，设为Infinity则为完全展开

const arr  = ['a' , 'b', 'c', ['d','e'], ['f', [ 'g', 'h']]];
console.log(arr.flat());['a','b','c','d','e','f',['g','h']]const arr  = ['a' , 'b', 'c', ['d','e'], ['f', [ 'g', 'h']]];
console.log(arr.flat(2));['a','b','c','d','e','f','g','h']

因此使用flat实现扁平化的方法为：

 const arr  = [1,[2,[3,[4,5]]]];console.log( arr.flat(Infinity) );

使用递归方法实现数组扁平化

Array.concat()方法
该方法可以把数组连接

console.log( [1,2].concat([3,[4,5]]) );
[1,2,3,[4,5]]

Array.isArray()方法
判断输入的元素是否是Array

使用递归方法实现数组扁平化：

要注意：因为Array.concat方法不会改变原来的数组，因此需要进行赋值操作，否则会得到不正确的结果

        const arr  = [1,[2,[3,[4,5]]]];function flatten(arr){let result = [];for(let i = 0;i<arr.length;i++){if( Array.isArray(arr[i]) ){result = result.concat(flatten(arr[i]));}else{result.push(arr[i]);}}return result;}console.log( flatten(arr) );

复杂度分析：

O(n)

其中n为扁平后一维数组的元素个数

使用reduce方法实现数组扁平化

Array.reduce()
该方法的输入有两个参数，第一个参数是函数，第二个参数可选，为初始值
第一个参数：该函数有四个形参，但是通常只用前两个 pre,cur
pre为上一次函数执行返回的结果
cur为当前遍历到的数组元素
第二个参数：如果不填，则pre默认从数组第一个元素开始，cur为第二个，
如果有参数，则pre为参数，cur为数组第一个元素

具体的实现方法：

        const arr  = [1,[2,[3,[4,5]]]];function flatten(arr){return arr.reduce((pre,cur)=>{return pre.concat( Array.isArray(cur)?flatten(cur):cur );},[]);}console.log( flatten(arr) );

使用Array.toString()和String.split()方式实现数组扁平化

Array.toString()
可以把数组转换成字符串
具体的转换效果：

 const arr  = [1,[2,[3,[4,5]]]];console.log( arr.toString() );"1,2,3,4,5"

String.split()
可以把字符串拆分成数组
不填的话默认是整个字符串是数组的一个元素，填写的话就会按分隔符拆分
这种方法的问题是，拆分后，数组的每一个元素是字符，而不是数字了

具体实现方法：

 const arr  = [1,[2,[3,[4,5]]]];console.log( arr.toString().split(",") );

前端学习-JavaScript每日一题-数组扁平化相关推荐

JavaScript数组常用方法解析和深层次js数组扁平化
前言数组作为在开发中常用的集合,除了for循环遍历以外,还有很多内置对象的方法,包括map,以及数组筛选元素filter等. 注:文章结尾处附深层次数组扁平化方法操作. 作为引用数据类型的一种,在处 ...
前端学习之——js解析json数组
** 前端学习之--js解析json数组 ** 解析json数组即对JSONArray的遍历一.对于标准的json数组如: var result=[{"flag":1," ...
JavaScript数组扁平化的实现
数组扁平化数组扁平化指的是把一个多维数组拆分成一个一维数组. 递归 function flattern(arr){let result = [];for(let i = 0, len = arr.l ...
【算法图解|2】JavaScript 如何实现数组扁平化
数组的扁平化,就是将一个嵌套多层的数组 array (嵌套可以是任何层数)转换为只有一层的数组. 举个例子,假设有个名为 flatten 的函数可以做到数组扁平化, var arr = [1, [2, ...
前端面试题 HTML5 CSS3(盒子模型、盒子水平垂直居中、经典布局) JS(闭包、深浅克隆、数据劫持和拦截) 算法(排序、去重、数组扁平化) Vue(双向数据绑定原理、通信方式)
前端面试题 HTML5 相关面试题 CSS3 相关面试题盒子模型盒子水平垂直居中的方案经典布局方案圣杯布局双飞翼布局 flex布局定位方式布局 css实现三角形 JS 相关面试题 8种数据 ...
es6删除数组某一项_精学手撕系列——数组扁平化
参考文章:面试官连环追问:数组拍平(扁平化) flat 方法实现编者荐语: 在前端面试中,手写flat是非常基础的面试题,通常出现在笔试或者第一轮面试中,主要考察面试者基本的手写代码能力和JavaS ...
转成数组_JavaScript之数组扁平化
今天给大家分享一下JavaScript的数组扁平化. 1. 扁平化数组的扁平化,就是将一个嵌套多层的数组 array (嵌套可以是任何层数)转换为只有一层的数组.举个例子,假设有个名为 flatte ...
JAVA数组扁平化整合_一文搞定数组扁平化（超全面的数组拉平方案及实现）
前言面试手写代码在大厂面试中非常常见,秋招中面试小米就手写了一道flat实现的代码题,当时通过递归方式实现了数组扁平化逻辑,但没有考虑多种实现方案及其边界条件(主要是对所涉及到高阶函数的知识点不够熟 ...
python观察日志(part24)--列表和numpy数组扁平化
学习笔记,仅供参考,有错必究参考文献:python–列表.数组扁平化:你知道如何将python中嵌套的列表扁平化吗? 列表扁平化方案1 print(sum([[1, 2, 3], ["s ...
实现数组扁平化的 6 种方式
实现数组扁平化的 6 种方式老规矩,开局先上问题,带着问题去思考: 怎样用最普通的方法解决数组扁平化问题? ES6里面是否有一些高级的方法能够直接实现? 扁平化的实现数组的扁平化其实就是将一个 ...