在JS中flat() 和 flatMap()使用讲解

devtools/2025/1/16 1:43:50/

flat()flatMap() 是 JavaScript 中处理数组的两个方法,用于处理嵌套数组,但它们有不同的用途和效果。以下是它们的详细区别:

1. Array.prototype.flat()

  • 功能:将嵌套的数组“拉平”成一维数组。

  • 语法:

    array.flat([depth])
    
  • depth:可选参数,表示要拉平的深度。默认值是 1。

  • 示例:

    const arr = [1, [2, [3, [4]]]];
    console.log(arr.flat());          // [1, 2, [3, [4]]]
    console.log(arr.flat(2));         // [1, 2, 3, [4]]
    console.log(arr.flat(3));         // [1, 2, 3, 4]
    
  • 说明: flat() 只负责将数组拉平,并不会对数组中的元素进行处理。它简单地将嵌套层次减少到指定的深度。

2. Array.prototype.flatMap()

  • 功能:对数组中的每个元素应用一个函数,然后将结果“拉平”成一维数组。

  • 语法

    array.flatMap(callback[, thisArg])
    
  • callback:一个函数,用于处理数组中的每个元素,并返回一个数组。

  • thisArg:可选参数,指定 callback 中 this 的值。

  • 示例:

    const arr = [1, 2, 3, 4];
    const result = arr.flatMap(x => [x, x * 2]);
    console.log(result);  // [1, 2, 2, 4, 3, 6, 4, 8]
    
  • 说明: flatMap() 先对每个元素执行 callback 函数,然后将所有返回的数组“拉平”到一维。它常用于需要对数组元素进行映射,并将结果扁平化的场景。

对比总结

  • flat():将嵌套的数组按指定深度拉平,主要用于调整数组的层次结构。
  • flatMap():对每个元素应用一个映射函数,返回的数组会被“拉平”,常用于将嵌套的结果合并成一个平面数组。

实际使用场景

  • flat():当你有多层嵌套数组,并且只想简单地减少嵌套深度时使用。
  • flatMap():当你需要对数组中的元素进行映射操作,并将结果合并成一个平面数组时使用。

http://www.ppmy.cn/devtools/109473.html

相关文章

C语言新手小白详细教程(8)ASCll编码和字符串

🌏个人博客主页:意疏-CSDN博客 希望文章能够给到初学的你一些启发~ 如果觉得文章对你有帮助的话,点赞 关注 收藏支持一下笔者吧~ 阅读指南: 开篇说明ASCll编码字符串 开篇说明 本章节我们学习C语言中一个…

MySQL——视图(一)视图概述

视图是从一个或多个表中导出来的表,它是一种虚拟存在的表,并且表的结构和数据都依赖于基本表。通过视图不仅可以看到存放在基本表中的数据,并且还可以像操作基本表一样,对视图中存放的数据进行查询、修改和删除。与直接操作基本表…

Leetcode面试经典-115.不同的子序列

解法都在代码里&#xff0c;不懂就留言或者私信 理论上提交这个就是最优解 class Solution {public int numDistinct(String s, String t) {if(s.length() < t.length()) {return 0;}if(s.length() t.length()) {return s.equals(t)? 1 : 0;}char[] sArr s.toCharArray…

什么是图像的边缘?说说边缘检测的任务以及基本原理?

什么是图像的边缘&#xff1f;说说边缘检测的任务以及基本原理&#xff1f; 什么是图像的边缘&#xff1f;边缘检测的任务边缘检测的基本原理 什么是图像的边缘&#xff1f; 图像的边缘是图像中亮度、颜色或纹理等特征发生急剧变化的地方&#xff0c;这些变化通常代表了图像中…

Llama 3.1大模型的预训练和后训练范式解析

Meta的Llama大型语言模型每次出新版本&#xff0c;都会是一大事件。前段时间他们不仅发布了3.1的一个超大型的405亿参数模型&#xff0c;还对之前的8亿和70亿参数的模型做了升级&#xff0c;让它们在MMLU测试中的表现更好了。 不同模型在MMLU基准测试中的表现 他们还出了一个9…

elementUI table 给表头添加气泡显示(鼠标悬浮显示注释)

elementUI table 给表头添加气泡显示&#xff08;鼠标悬浮显示注释&#xff09; 前言&#xff1a;文档显示&#xff1a;&#xff08;使用插槽&#xff0c;我看看到底是怎么个事儿&#xff09;文档代码:修改后的效果&#xff1a;页面效果&#xff1a; 前言&#xff1a; 公司出现…

开源可视化大屏superset Docker环境部署

superset 开源可视化大屏Docker环境部署 前言 superset是俄罗斯开源的一款可视化大屏&#xff0c;用于数据可视化探索&#xff0c;含有丰富的图表组件&#xff0c;可以支持接入各种数据源。 接触superset就是想体验下可视化大屏功能&#xff0c;想最快速度安装成功&#xff…

30天pandas挑战

大的国家 挑选出符合要求的行 def big_countries(world: pd.DataFrame) -> pd.DataFrame:df world[(world[area] > 3000000) | (world[population] > 25000000)]return df[[name,population,area]] 在Pandas中&#xff0c;当你使用条件过滤时&#xff0c;应该使用 …