扁平化数组 Array.prototype.flat()

最新推荐文章于 2025-06-08 21:35:46 发布
转载 最新推荐文章于 2025-06-08 21:35:46 发布 · 900 阅读 · 2 ·
CC 4.0 BY-SA版权
原文链接：https://juejin.im/post/6844904025993773063#heading-9
文章标签：

#javascript

本文介绍JavaScript中Array.prototype.flat()方法的使用技巧，包括默认拉平一层、指定层数进行拉平、使用Infinity完全拉平等操作，以及如何处理数组中的空位。 
const animals = ["🐷", ["🐶", "🐂"], ["🐎", ["🐑", ["🐲"]], "🐛"]];

// 不传参数时，默认“拉平”一层
animals.flat();
animals.flat(1);
// ["🐷", "🐶", "🐂", "🐎", ["🐑", ["🐲"]], "🐛"]

// 传入一个整数参数，整数即“拉平”的层数
animals.flat(2);
// ["🐷", "🐶", "🐂", "🐎", "🐑", ["🐲"], "🐛"]

// Infinity 关键字作为参数时，无论多少层嵌套，都会转为一维数组
animals.flat(Infinity);
// ["🐷", "🐶", "🐂", "🐎", "🐑", "🐲", "🐛"]

// 传入 <=0 的整数将返回原数组，不“拉平”
animals.flat(0);
animals.flat(-10);
// ["🐷", ["🐶", "🐂"], ["🐎", ["🐑", ["🐲"]], "🐛"]];

// 如果原数组有空位，flat()方法会跳过空位。
["🐷", "🐶", "🐂", "🐎",,].flat();
// ["🐷", "🐶", "🐂", "🐎"]

Array.prototype.flat() 特性总结

  1. Array.prototype.flat() 用于将嵌套的数组“拉平”，变成一维的数组。该方法返回一个新数组，对原数据没有影响。

  2. 不传参数时，默认“拉平”一层，可以传入一个整数，表示想要“拉平”的层数。

  3. 传入 <=0 的整数将返回原数组，不“拉平”
    Infinity 关键字作为参数时，无论多少层嵌套，都会转为一维数组

  4. 如果原数组有空位，Array.prototype.flat() 会跳过空位。

面试官连环追问：数组拍平（扁平化） flat 方法实现
公众号：前端铁蛋
12-28 1725
前言 前段时间秋招面哔哩哔哩的时候，面试官问：如何实现 flat 方法？当时手写的并不完美，后来回盘复习，发现面试要求手写数组拍平（扁平化） flat 方法的面试官不在少数。其中包括：拼多多、小米、美团、滴滴、shopee、有赞等。手写 flat 方法是一道非常基础的面试题，通常出现在笔试或者第一轮面试当中，主要考察基本的手写代码的能力。今天就从了解 flat 特性到实现 flat 再到接住面试官...
【JS新人向】MDN Web文档 Array.prototype.flat() 扁平化数组的四个替代方案代码解析 #全看懂挑战
ljinest
04-08 1096
MDN Web文档 Array.prototype.flat() 扁平化数组的四个替代方案代码解析 文章目录MDN Web文档 Array.prototype.flat() 扁平化数组的四个替代方案代码解析什么是扁平化标准方法替代方案后言 注：本文为MDN标准Web文档中例子的解释，代码来自MDNArray.prototype.flat()。 什么是扁平化 将某一个数组的所有元素及子数组中的元素合并为一个新数组并返回。 const arr1 = [0, 1, 2, [3, 4]]; console.lo
JS数组扁平化(flat)方法总结详解
12-01
需求:多维数组=>一维数组 let ary = [1, [2, [3, [4, 5]]], 6]; let str = JSON.stringify(ary); 第0种处理:直接的调用 arr_flat = arr.flat(Infinity); 第一种处理 ary = str.replace(/(\[\]))/g, '').split(','); 第二种处理 str = str.replace(/(\[\]))/g, ''); str = '[' + str + ']'; ary = JSON.parse(str); 第三种处理：递归处理 let result = [];
JavaScript Array.flat()函数用法解析
10-14
主要介绍了JavaScript Array.flat()函数用法解析,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
JS手写数组扁平化（flat）方法
热爱前端的大三在校生
10-31 6545
数组扁平化方法也叫数组拍平、数组拉平、数组降维。Array.prototype.flat() 用于将嵌套的数组“拉平”，变成一维的数组。该方法返回一个新数组，对原数据没有影响。
面试官：JavaScript如何实现数组拍平（扁平化）方法?
qq_38650754的博客
11-01 2289
1 什么叫数组拍平？ 概念很简单，意思是将一个“多维”数组降维，比如： // 原数组是一个“三维”数组 const array = [1, 2, [3, 4, [5, 6], 7], 8, 9] // 可以降成二维 newArray1 = [1, 2, 3, 4, [5, 6], 7, 8, 9] // 也可以降成一维 newArray2 = [1, 2, 3, 4, 5, 6, 7, 8, 9] 数组拍平也称数组扁平化、数组降维。 2 JS标准库中的数组拍平方法 JavaScript标准库中已经实现
Array.prototype.flat 兼容ES3到ESNext的数组扁平化实现
Array.prototype.flat 是 JavaScript 中用于数组扁平化的重要方法，它允许开发者将嵌套多层的数组结构“展平”为一维数组。该方法自 ES2019（ECMAScript 2019）标准中被正式引入，成为原生 Array 构造函数原型链上的...
JavaScript数组扁平化（Array Flattening）全解析：从基础到进阶的9种实现方式及深度对比
最新发布
读心悦
06-08 1366
本文系统总结了JavaScript中数组扁平化的实现方法与应用场景。主要内容包括： 原生方法：介绍Array.prototype.flat()、扩展运算符+concat等方法的使用与局限； 递归与迭代：对比递归遍历、迭代循环等实现方式的优缺点； ES6新特性：展示Generator函数、解构赋值等新特性的应用； 第三方库：提及Lodash的工业级实现方案。文章通过代码示例详细说明各方法的适用场景、性能表现和注意事项，为处理多维数组提供了全面的技术方案参考。
【JS】手写实现Array数组扁平化方法flat
weixin_57208584的博客
03-20 249
实现要求：参考MDN。
你不知道的JavaScript数组扁平化五种方法
01-08
ES6引入了`flat()`方法，它可以将数组中的子数组展开，从而达到扁平化的效果。不过，此方法的兼容性较差，不支持IE浏览器，并且需要Node.js 11及以上版本。例如： ```javascript let arr = [1, [2, 3, 4], [3, 5,...
手写实现数组flat、filter等方法
冻书的博客
03-30 946
Flat flat 是将数组扁平化的一种方法。 比如：我们有一个数组： let arr = [ [1,2,3], [4,5,6], [6,7, [3,4]] ] 现在需要将数组元素转化成 [ 1, 2, 3, 4, 5, 6, 6, 7, [ 3, 4 ] ] （浅扁平）或 [ 1, 2, 3, 4, 5, 6, 6, 7, 3, 4] （深扁平） 浅扁平：只能扁平化二级数组 深扁平：可以扁平多维数组 浅扁平实现 第一种：自带方法 function myFlat(arr) { arr = Array
手写数组扁平化/手写flat
weixin_52017993的博客
09-08 310
首先写一个myflat函数，使用forEach遍历数组的每一项，使用isArray去判断每一项是否都是数组，不是的话就push到新的数组里面，是的话就递归调用myflat函数，在使用concat连接数组赋值到新的数组里面去。实现：定义一个空数组result，再去遍历数组里的每一项，判断是否为数组，是的话就将数据都放到result里面，结合concat，考虑到可能是循环嵌套的数组，所以要递归调用函数。否则就使用reduce方法，里面判断是否是一个数组，是的话使用。方法三：使用forEach和递归的方法。
JS手写flat函数
weixin_44717047的博客
12-15 1470
flat() 方法会按照一个可指定的深度递归遍历数组，并将所有元素与遍历到的子数组中的元素合并为一个新数组返回。 const arr = [1, 2, [3, 4, [5, 6, [7]]], 8]; console.log(arr.flat(Infinity)); //[1,2,3,4,5,6,7,8] console.log(arr.flat(2)); //[1,2,3,4,5,6,[7],8] 手写flat函数： function flat(arr,n) { let times = 0; //利
手写数组扁平化
Qingshan_z的博客
08-30 360
手写数组扁平化 问题描述： 输入深度数组例如[1, 2, [3, 4, 5, [6, 7]]] 输出[1,2,3,4,5,6,7] 变为一个数组且不改变原有顺序 代码演示： //手写数组扁平化 function flat(arr) { const isDeep = arr.some(item => item instanceof Array); //判断数组是否是深度数组， if (!isDeep) { return arr;//不是深度数组直接返回结果
js手写数组扁平化
weixin_43595755的博客
06-27 236
function flatten(arr) { let res = []; for (let i = 0; i < arr.length; i++) { if (Array.isArray(arr[i])) { res = res.concat(flatten(arr[i])); } else res = res.concat(arr[i]); } return res; }
JS手写数组扁平化（可控制扁平化维度）
qq_40868156的博客
06-23 554
手写js的数组扁平化，并且可以控制扁平化的维度或深度。
数组 flat
大灰狼的小绵羊哥哥的博客
04-01 2378
一段代码总结Array.prototype.flat()特性 注：数组拍平方法Array.prototype.flat()也叫数组扁平化、数组拉平、数组降维。 本文统一叫：数组拍平 const animals = ["????", ["????", "????"], ["????", ["????", ["????"]], "????"]]; // 不传参数时，默认“拉平”一层 animals.flat(); // ["????", "????", "????", "????", ["????",
评论 1
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
表情包 代码片
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值