本文汇总了JavaScript中获取数组最后一个元素的三种常用方法：利用length属性、slice方法以及pop方法。文章详细解析了各方法的原理与适用场景，并通过实际代码测试对比了它们的执行性能。结果显示pop()和slice(-1)效率远高于直接通过length索引访问，且pop会修改原数组，开发者可根据是否允许修改数组来选择合适方案。
在 JavaScript 开发中，若需获取数组的最后一个元素，存在多种实现路径。本文将详细介绍三种可行的技术手段。
1. 利用数组 length 属性
length 属性返回数组中元素的数量。从数组的长度中减去 1 得到数组最后一个元素的索引，使用它可以访问最后一个元素。从长度中减去 1 的原因是，在 JavaScript 中，数组索引编号从 0 开始。即第一个元素的索引将为 0。因此，最后一个元素的索引将为数组的 length-1。
const arrayTest = ["第一个元素", "第二个元素", "最后一个元素"];
const length = arrayTest.length;
const lastValue = arrayTest[length - 1];
console.log(lastValue); // 最后一个元素2. 使用数组 slice 方法
slice() 方法用于从原数组中提取指定范围的元素，并返回一个包含这些元素的新数组对象。该方法不会改变原始数组，而是根据给定的起始索引（含）和结束索引（不含）进行截取。当传入负数索引时，slice() 会从数组末尾开始计算位置。结合数组解构赋值语法，可以从 slice() 返回的单元素数组中提取出目标元素。
const arrayTest = ["第一个元素", "第二个元素", "最后一个元素"];
const length = arrayTest.length;
const [lastValue] = arrayTest.slice(-1);
console.log(lastValue); // 最后一个元素3. 使用数组 pop 方法
pop() 方法用于移除数组的最后一个元素，并将其作为返回值返回。需要注意的是，此操作会直接修改原始数组的结构。若原数组为空，该方法将返回 undefined，且不对数组进行任何修改。
const arrayTest = ["第一个元素", "第二个元素", "最后一个元素"];
const length = arrayTest.length;
const lastValue = arrayTest.pop();
console.log(lastValue); // 最后一个元素
console.log(arrayTest); // [ '第一个元素', '第二个元素' ]性能比较
接下来对上述三种方法的执行效率进行对比测试。
const arrayTest = ["第一个元素", "第二个元素", "最后一个元素"];
console.time("==> length");
const length = arrayTest.length;
let lastValue = arrayTest[length - 1];
console.log(lastValue);
console.timeEnd("==> length");
console.time("====> slice");
let [lastValue1] = arrayTest.slice(-1);
console.log(lastValue1);
console.timeEnd("====> slice");
console.time("======> pop");
let lastValue2 = arrayTest.pop();
console.log(lastValue2);
console.timeEnd("======> pop");测试输出结果如下所示：
最后一个元素
==> length: 6.38ms
最后一个元素
====> slice: 0.038ms
最后一个元素
======> pop: 0.033ms总结
从性能测试来看，pop() 方法的执行速度最快，在允许修改原数组的前提下，它是首选方案。若要求保持原数组不变，则推荐使用 slice() 方法。相比之下，利用数组 length 属性直接索引的方式效率最低，尽管它是获取最后一个元素最为直观和常见的写法。
以上就是关于 JavaScript 中获取数组最后一个元素的各种方法汇总。如需了解更多相关技术内容，欢迎查阅本站往期文章或继续浏览后续章节。感谢大家的支持！