七个令人惊叹的 JavaScript 数组方法,简单的令人惊讶

如果你曾经想过,“除了 for 循环和 map() 之外,我不需要任何东西”,听好了,因为我将向你分享那是多么的错误。
首页 新闻资讯 行业资讯 七个令人惊叹的 JavaScript 数组方法,简单的令人惊讶

如果你曾经想过,“除了 for 循环和 map() 之外,我不需要任何东西”,听好了,因为我将向你分享那是多么的错误。

846a85e547de71465a3712afeb3e5ba1e3c43e.jpg

以下这 7 种被低估的数组方法,它们可能会让你大吃一惊——是的,它们使用起来非常有趣。

1. copyWithin()

想象一下复制一片披萨,但你得到的不是新的一片,而是笨拙地将其塞回同一个盒子里。

这就是 copyWithin() 的作用——它获取数组的一部分并将其复制到同一数组内的另一个位置。它不会增加长度,因此,不会产生额外的卡路里(或元素)。

constarr=[1,2,3,4,5];arr.copyWithin(0,3);// [4, 5, 3, 4, 5]

在这里,索引 3(4、5)中的元素被复制到索引 0 处,替换 1 和 2。您还可以指定可选的结束索引来限制要复制的部分。

2. at() 和 with()

这两个是很酷的新手。at() 首先出现,为我们提供了一种访问元素的简洁方法,尤其是使用负索引时。然后 with() 于 2023 年加入,自豪地提供用于修改数组元素的不可变替代品。

constcolors=['red','blue','green','yellow'];console.log(colors.at(-1));// 'yellow'console.log(colors.with(1,'purple'));// ['red', 'purple', 'green', 'yellow']

at() 非常适合在需要处理数组末尾时使用,而 with() 可确保在进行更新时原始数组保持不变。

3. reduceRight()

每个人都知道 reduce() — 它就像数组方法中的瑞士军刀。但您是否曾希望反过来操作?输入 reduceRight(),它从右到左处理数组。

constarr=['a','b','c','d'];constresult=arr.reduceRight((acc,curr)=>acc+curr);console.log(result);// 'dcba'

在此示例中,reduceRight() 从末尾开始组合元素,从而产生反向连接。

4. findLast()

向 ES13 中保密最严的秘密之一问好。findLast() 的工作原理与 find() 相同,但它从数组末尾开始搜索。

当您知道要搜索的项目更接近尾部时,这尤其有用。

constnums=[1,2,3,4,5,6,7];console.log(nums.findLast(n=>n%2===0));// 6

与从头开始搜索的 find() 不同,findLast() 从尾部开始,这使其成为特定场景的理想选择,例如查找特定类型值的最后一次出现。

5. toSorted()、toReversed()、toSpliced()

了解 sort()、reverse() 和 splice() 的不可变表亲。这些 ES2023 新增功能可让您操作数组而不改变原始数据。

你为什么要关心?因为当你的变量不会在你背后神秘地改变时,调试会容易一百万倍。

constarr=[3,1,4,1,5];// Immutable sortingconsole.log(arr.toSorted());// [1, 1, 3, 4, 5]console.log(arr);// [3, 1, 4, 1, 5]// Immutable reversingconsole.log(arr.toReversed());// [5, 1, 4, 1, 3]console.log(arr);// [3, 1, 4, 1, 5]

这些方法可让您在保持原始数组完整的同时进行更改,从而确保代码更可预测且更易于调试。

6. lastIndexOf()

lastIndexOf() 是 indexOf() 的被低估的兄弟,其功能正如您所想的那样 — 它可查找数组中元素的最后一次出现。您甚至可以指定停止搜索的位置。

constarr=['apple','banana','cherry','apple'];// Find the last occurrence of 'apple'console.log(arr.lastIndexOf('apple'));// 3// Limit the search to the first 3 elementsconsole.log(arr.lastIndexOf('apple',2));// 0

当您处理可能包含重复元素的数组,并且您特别需要最后一个实例时,此方法非常有用。

7. flatMap()

为什么要满足于 map() 和 flat(),而您可以将它们组合成一个流畅的操作?flatMap() 会转换您的数组并将结果展平一级。

constarr=[1,2,[3],4];// Mapping and flattening in one stepconsole.log(arr.flatMap(x=>[x*2]));// [2, 4, 6, 8]

这就像通过一次提交杀死两个错误 — — 更干净、更快、更令人满意。

最后的想法

这些数组方法可能不像 filter() 或 push() 那样流行,但它们非常强大。试试看,谁知道呢?你可能会给你的同事留下深刻印象——或者至少在代码审查中让他们感到困惑。

26    2025-02-17 11:10:49    JavaScrip 数组 开发