ES10 中的 Array.prototype.at() 方法详解

在 ECMAScript 2019 中，新增了一个 Array.prototype.at() 方法。该方法可以用于获取数组中指定索引位置的元素，而不需要通过数组的下标来获取。本文将介绍 Array.prototype.at() 方法的使用方法、示例代码以及其在实际开发中的应用。

使用方法

Array.prototype.at() 方法的语法如下：

arr.at(index)

其中，arr 表示需要获取元素的数组，index 表示需要获取的元素的索引位置。如果 index 为负数，则表示从数组的末尾开始计算，比如 -1 表示数组的最后一个元素。

需要注意的是，如果 index 超出了数组的边界，该方法会返回 undefined。如果 index 不是一个整数，则会自动向下取整，比如 1.6 会被转换成 1。

示例代码

下面是一些使用 Array.prototype.at() 方法的示例代码：

const arr = ['a', 'b', 'c', 'd', 'e'];

console.log(arr.at(2)); // c
console.log(arr.at(-1)); // e
console.log(arr.at(5)); // undefined
console.log(arr.at(1.6)); // b

上述代码中，我们创建了一个包含 5 个元素的数组 arr，然后使用 arr.at() 方法获取了数组中的指定元素。第一个示例中，我们获取了数组中索引为 2 的元素，即第三个元素。第二个示例中，我们使用了负数索引 -1 来获取数组中的最后一个元素。第三个示例中，我们尝试获取数组中索引为 5 的元素，但是该索引超出了数组的边界，所以返回了 undefined。最后一个示例中，我们传入了一个浮点数 1.6，该方法会自动向下取整并获取数组中索引为 1 的元素。

应用场景

Array.prototype.at() 方法可以用于获取数组中的指定元素，比如我们可以使用该方法获取数组中的第一个元素、最后一个元素、任意一个元素等。此外，在需要获取数组中指定元素的场景下，该方法也可以替代传统的数组下标索引方式，使代码更加简洁易读。

下面是一些实际开发中的应用场景：

获取数组中的第一个元素

const arr = ['a', 'b', 'c', 'd', 'e'];
const firstElement = arr.at(0);
console.log(firstElement); // a

获取数组中的最后一个元素

const arr = ['a', 'b', 'c', 'd', 'e'];
const lastElement = arr.at(-1);
console.log(lastElement); // e

获取数组中的随机元素

const arr = ['a', 'b', 'c', 'd', 'e'];
const randomIndex = Math.floor(Math.random() * arr.length);
const randomElement = arr.at(randomIndex);
console.log(randomElement);

上述代码中，我们使用 Math.random() 方法生成一个随机数，然后将该随机数转换成数组的索引位置。最后，使用 arr.at() 方法获取数组中的随机元素。

总结

本文介绍了 ES10 中的 Array.prototype.at() 方法的使用方法、示例代码以及其在实际开发中的应用。该方法可以用于获取数组中指定索引位置的元素，而不需要通过数组的下标来获取。在实际开发中，我们可以使用该方法获取数组中的第一个元素、最后一个元素、任意一个元素等，使代码更加简洁易读。

来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/662ca029d3423812e4a39685