在 ES10 中,Array 类型新增了两个非常实用的函数:flat()
和 flatMap()
。这两个函数能够大大简化数组的操作,使代码更加简洁易读。本文将详细介绍这两个函数的使用方法,以及它们在实际开发中的应用。
flat()
flat()
函数用于将多维数组转换为一维数组。它的语法如下:
-------------------
其中,array
表示要转换的数组,depth
表示要转换的维度。如果不指定 depth
参数,则默认将所有维度转换为一维数组。
下面是一个简单的例子:
----- ---- - --- -- --- ---- ----- ---- - ------------ ------------------ -- --- -- -- --
在上面的例子中,arr1
是一个包含两个元素的数组,其中第二个元素是一个包含两个元素的数组。调用 arr1.flat()
后,返回一个包含四个元素的一维数组。
如果要将多维数组转换为更深的维度,可以使用 depth
参数。例如:
----- ---- - --- -- --- -- --- ----- ----- ---- - ------------- ------------------ -- --- -- -- -- -- --
在这个例子中,arr1
是一个包含三个元素的数组,其中第三个元素是一个包含两个元素的数组,再嵌套一个包含两个元素的数组。调用 arr1.flat(2)
后,返回一个包含六个元素的一维数组。
值得注意的是,flat()
函数会自动过滤掉数组中的空项。例如:
----- ---- - --- -- - --- ----- ---- - ------------ ------------------ -- --- -- --
在这个例子中,arr1
包含四个元素,其中第三个元素是一个空项。调用 arr1.flat()
后,返回一个包含三个元素的一维数组,自动过滤掉了空项。
flatMap()
flatMap()
函数是 map()
和 flat()
函数的组合,可以对数组进行映射和转换。它的语法如下:
-----------------------
其中,array
表示要转换的数组,callback
表示对数组元素进行处理的回调函数。flatMap()
函数会先对数组元素执行 map()
函数,然后再对返回的数组执行 flat()
函数。
下面是一个简单的例子:
----- ---- - --- -- --- ----- ---- - -------------- -- -- - ---- ------------------ -- --- -- --
在这个例子中,arr1
包含三个元素。调用 arr1.flatMap(x => [x * 2])
后,先对数组元素执行 map()
函数,将每个元素乘以 2,返回一个新的数组。然后再对返回的数组执行 flat()
函数,将多维数组转换为一维数组,最终返回一个包含三个元素的一维数组。
需要注意的是,flatMap()
函数会自动过滤掉数组中的空项,与 flat()
函数的行为相同。
应用场景
flat()
和 flatMap()
函数的应用场景非常广泛,特别是在处理多维数组时更是如此。下面列举几个常见的应用场景:
1. 数组去重
使用 flat()
函数可以方便地将多维数组转换为一维数组,然后再使用 Set
对象进行去重。例如:
----- ---- - --- -- --- -- --- ----- ----- ---- - ------- ------------------ ------------------ -- --- -- -- -- -- --
在这个例子中,arr1
是一个包含三个元素的数组,其中第三个元素是一个包含两个元素的数组,再嵌套一个包含两个元素的数组。使用 arr1.flat()
将多维数组转换为一维数组,然后使用 Set
对象进行去重,最终返回一个包含六个元素的一维数组。
2. 数组扁平化
使用 flatMap()
函数可以方便地对数组进行扁平化操作。例如:
----- ---- - ---- --- --- --- --- ---- ----- ---- - -------------- -- --- ------------------ -- --- -- -- -- -- --
在这个例子中,arr1
是一个包含三个元素的数组,每个元素都是一个包含两个元素的数组。使用 arr1.flatMap(x => x)
对数组进行扁平化操作,最终返回一个包含六个元素的一维数组。
3. 数组转换
使用 flatMap()
函数可以方便地对数组进行转换操作。例如:
----- ---- - --------- --------- ----- ---- - -------------- -- ------------- ------------------ -- ----- ---- ---- ---- ---- ---- ---- ---- ---- ----
在这个例子中,arr1
是一个包含两个元素的数组,每个元素都是一个字符串。使用 arr1.flatMap(x => x.split(''))
对数组进行转换操作,将每个字符串转换为包含每个字符的数组,最终返回一个包含十个元素的一维数组。
总结
flat()
和 flatMap()
函数是 ES10 中 Array 类型新增的两个非常实用的函数,能够大大简化数组的操作,使代码更加简洁易读。使用这两个函数可以方便地对数组进行去重、扁平化和转换等操作。在实际开发中,这两个函数的应用场景非常广泛,特别是在处理多维数组时更是如此。
来源:JavaScript中文网 ,转载请联系管理员! 本文地址:https://www.javascriptcn.com/post/65e401961886fbafa4035c1a