JavaScript数组中arr[arr.length]的含义及作用是什么？

基础含义 #

首先你需要明确两个JS数组的基础特性：

• JS数组的下标从0开始计数，长度为n的数组，现有元素的合法下标范围是0 ~ arr.length - 1
• JS数组是动态长度的，访问超出现有下标的位置不会报越界错误，只会返回undefined

arr[arr.length]本质就是访问下标等于数组当前总长度的位置，这个位置天然就是数组现有最后一个元素的下一个空位。

实际作用 #

这个语法最常见的用法是用来给数组追加新元素：

• 如果你直接读取arr[arr.length]，得到的结果是undefined，因为这个位置还没有存储任何值
• 如果你给arr[arr.length]赋值，JS数组会自动把这个值作为新元素添加到数组末尾，同时数组长度自动+1，效果和调用arr.push(要添加的值)完全一致。

举个实际运行的例子：

const arr = ['a', 'b', 'c']
console.log(arr.length) // 输出3，现有元素下标为0、1、2
console.log(arr[arr.length]) // 访问arr[3]，输出undefined

arr[arr.length] = 'd'
console.log(arr) // 输出 ['a','b','c','d']，数组长度变为4

补充说明 #

• 早期JS标准没有提供push方法的时候，这是给数组追加元素的标准实现方案
• 现在日常开发更推荐用arr.push()，可读性更高，两者的性能差异可以忽略不计
• 注意不要和arr[arr.length - 1]混淆，后者是用来获取数组现有最后一个元素的写法

内容的提问来源于stack exchange，提问作者Ali Hassan