ECMAScript 2021 中 Array.prototype.at()：如何更快地访问数组元素
在前端开发中，数组是经常使用的数据结构之一。在访问数组元素时，我们通常使用下标来获取元素。但是，由于数组的长度不确定，当下标超出数组范围时，我们通常需要进行边界检查。而在 ECMA2019 中新增的 Array.prototype.at() 方法正是为了解决这个问题。
Array.prototype.at() 方法能够更轻松、更快速地访问数组元素，尤其是当我们需要在访问数组元素时，要进行边界检查的情况下更为常见。
- Array.prototype.at() 方法的使用说明
Array.prototype.at() 方法接收一个整数参数，表示需要访问的数组元素的下标。如果下标为负数，则表示从末尾开始计算。当下标大于或等于数组长度时，返回 undefined。
示例代码：
const arr = [1, 2, 3, 4, 5]; console.log(arr.at(2)); // 3 console.log(arr.at(-1)); // 5 console.log(arr.at(10)); // undefined
在以上示例代码中，我们使用了 Array.prototype.at() 方法来访问数组元素。我们可以看到，使用这种方式访问数组元素时，不需要进行额外的边界条件检查，十分方便。
- Array.prototype.at() 方法与普通下标访问的对比
我们来看一个实际的例子，比较使用 Array.prototype.at() 方法和普通下标访问数组元素时的性能差异。
示例代码：
-- -------------------- ---- ------- ----- --- - --- ----------------------- ---------------- --------- --- ---- - - -- - - -------- ---- - ---------- - ------------------- --------- -------------------- --------- --- ---- - - -- - - -------- ---- - ------- - ----------------------- ---------展开代码
在此示例中，我们创建了一个包含 1000000 个元素的数组，并使用 Array.prototype.at() 和普通下标访问方法，分别对元素进行了访问。
执行上面代码后，我们会得到类似下面的输出：
at method: 3.090ms common access: 4.846ms
可以看到，使用 Array.prototype.at() 方法时，比普通的下标访问更快。
这是因为在普通下标访问方式中，如果我们使用不合法的下标进行访问时，程序会抛出异常，这需要额外的处理时间和资源。而使用 Array.prototype.at() 方法时，不会出现越界访问，因此不会产生额外的异常处理开销。
- 小结
通过本文的介绍，我们了解到了 ECMAScript 2021 中新增的 Array.prototype.at() 方法，以及它的使用方法和与普通下标访问方式的对比。
在实际的项目中，使用 Array.prototype.at() 方法能够更快地访问数组元素，减少边界条件检查的开销，从而提升代码的性能。
欢迎大家在实际开发中尝试使用该方法，提高 JavaScript 代码的效率。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/67930901504e4ea9bd71283f
