除了普通对象之外，数组是 JavaScript 中广泛使用的数据结构，而数组中常用操作是按索引访问元素。在本文中，我们介绍新的数组方法array.at(index)。

1.方括号语法的局限性

通过索引访问数组元素一般使用方括号array[index]：

1. const fruits = ['orange', 'apple', 'banana', 'grape']; 
2.  
3. const item = fruits[1]; 
4. item; // => 'apple' 

表达式array[index]求值为位于index的数组项，这种方式也叫属性访问器。

在大多数情况下，方括号语法是通过正索引(>= 0)访问项的好方法，它的语法简单且可读。

但有时我们希望从末尾访问元素，而不是从开始访问元素。例如，访问数组的最后一个元素：

1. const fruits = ['orange', 'apple', 'banana', 'grape']; 
2.  
3. const lastItem = fruits[fruits.length – 1]; 
4. lastItem; // => 'grape' 

fruits[fruits.length – 1]是访问数组最后一个元素的方式，其中fruits.length – 1是最后一个元素的索引。

问题在于方括号访问器不允许直接从数组末尾访问项，也不接受负下标。

幸运的是，一个新的提议(截至2021年1月的第3阶段)将at()方法引入了数组(以及类型化的数组和字符串)，并解决了方括号访问器的诸多限制。

2.array.at() 方法

简单来说，array.at(index)访问index参数处的元素。

如果index参数是一个正整数>= 0，该方法返回该索引处的项目。

1. const fruits = ['orange', 'apple', 'banana', 'grape']; 
2.  
3. const item = fruits.at(1); 
4. item; // => 'apple' 

如果index参数大于或等于数组长度，则与常规访问器一样，该方法返回undefined：

1. const fruits = ['orange', 'apple', 'banana', 'grape']; 
2.  
3. const item = fruits.at(999); 
4. item; // => undefined 

真正神奇的是，当你对array.at()方法使用负下标时，将从数组的末尾访问元素。

1. const lastItem = fruits.at(-1); 
2. lastItem; // => 'grape' 

下面是更详细的array.at()方法示例：

1. const vegetables = ['potatoe', 'tomatoe', 'onion']; 
2.  
3. vegetables.at(0); // => 'potatoe' 
4. vegetables.at(1); // => 'tomatoe' 
5. vegetables.at(2); // => 'onion' 
6. vegetables.at(3); // => undefined 
7.  
8. vegetables.at(-1); // => 'onion' 
9. vegetables.at(-2); // => 'tomatoe' 
10. vegetables.at(-3); // => 'potatoe' 
11. vegetables.at(-4); // => undefined