ECMAScript 2021 (ES12) 中新的 Array 方法详解

阅读时长 7 分钟读完

在 ECMAScript 2021(ES12)中,我们可以看到一些新的、令人振奋的 Array 方法,这些方法可以让我们更方便地处理数组。在本文中,我们将详细解释这些新的方法,并给出一些实例代码,以便更好地说明它们的用法。

Array.prototype.at()

Array.prototype.at() 方法可以在数组中根据指定的索引位置获取元素。如果索引越界,则返回 undefined。它的语法如下:

例子:

Array.prototype.filter()

Array.prototype.filter() 方法可以根据指定的条件过滤出数组中的元素,并返回一个新数组。它的语法如下:

其中,callback 函数接受三个参数:element 表示当前数组元素,index 表示当前元素的下标,array 表示当前的数组对象,可以省略第二个和第三个参数。thisArgcallback 函数调用时的 this 值。

例子:

Array.prototype.flatMap()

Array.prototype.flatMap() 方法可以对数组中每个元素执行一个映射转换,并返回一个新的、扁平化的数组。它的语法如下:

其中,callback 函数接受三个参数:element 表示当前数组元素,index 表示当前元素的下标,array 表示当前的数组对象,可以省略第二个和第三个参数。thisArgcallback 函数调用时的 this 值。

例子:

Array.prototype.reduceRight()

Array.prototype.reduceRight() 方法可以从数组的末尾开始遍历,并将回调函数的返回值和下一个元素一起作为下一次调用的参数。它的语法如下:

其中,callback 函数接受四个参数:accumulator 表示上一次调用后的返回值,currentValue 表示当前元素的值,currentIndex 表示当前元素的下标,array 表示当前的数组对象。initialValue 为初始值。

例子:

Array.prototype.findLast()

Array.prototype.findLast() 方法可以在数组中从末尾开始查找符合条件的第一个元素,并返回该元素。如果没有符合条件的元素,则返回 undefined。它的语法如下:

其中,callback 函数接受三个参数:element 表示当前数组元素,index 表示当前元素的下标,array 表示当前的数组对象,可以省略第二个和第三个参数。thisArgcallback 函数调用时的 this 值。

例子:

Array.prototype.findIndexLast()

Array.prototype.findIndexLast() 方法可以在数组中从末尾开始查找符合条件的第一个元素,并返回该元素的下标。如果没有符合条件的元素,则返回 -1。它的语法如下:

其中,callback 函数接受三个参数:element 表示当前数组元素,index 表示当前元素的下标,array 表示当前的数组对象,可以省略第二个和第三个参数。thisArgcallback 函数调用时的 this 值。

例子:

Array.prototype.copyWithin()

Array.prototype.filter() 方法可以将数组中指定范围内的元素复制到数组的指定位置。它的语法如下:

其中,target 表示替换的目标位置,start 表示复制的开始位置,默认为 0end 表示复制的结束位置,默认为数组结束位置。

例子:

Array.prototype.includes()

Array.prototype.includes() 方法可以判断数组中是否包含指定的元素,如果包含则返回 true,否则返回 false。它的语法如下:

其中,searchElement 表示要搜索的元素,fromIndex 表示搜索的起始位置,默认为 0

例子:

总结:

在 ECMAScript 2021(ES12)中,我们介绍了六个新的 Array 方法,包括 Array.prototype.at()Array.prototype.filter()Array.prototype.flatMap()Array.prototype.reduceRight()Array.prototype.findLast()Array.prototype.findIndexLast()Array.prototype.copyWithin()、以及Array.prototype.includes()。这些新的方法可以极大地方便我们对数组的处理。在实际使用中,需要注意这些方法的用法,以便更好地完成项目。

来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/64c9c9c55ad90b6d0418218b

纠错
反馈