首页 > 编程语言 >JavaScript 中获取数组最后一个元素3种方法及性能

JavaScript 中获取数组最后一个元素3种方法及性能

时间:2023-02-05 23:00:34浏览次数:44  
标签:元素 console arrayTest JavaScript 获取 length 数组 const

JavaScript 中获取数组最后一个元素3种方法及性能_数组

当需要从 JavaScript 中的数组中获取最后一个元素时,有多种选择,本文将提供 3 种可用方法。

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); // [ '第一个元素', '第二个元素' ]

性能比较

让按性能比较这 3 种方法。

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 属性的方法是最慢的,属于是获取数组最后一个元素的最常用方法。

标签:元素,console,arrayTest,JavaScript,获取,length,数组,const
From: https://blog.51cto.com/devpoint/6038512

相关文章

  • PHP遍历数组的6种方式总结
    目录1、foreach2、array_map3、array_walk4、for5、each6、reset总结在PHP的日常操作中,数组是最常出现的结构,而我们几乎每天都在处理数组相关的内容。那么问题来......
  • 关于PHP数组迭代器的使用方法实例
    近来在开发一个视力筛查电子报告系统的产品,这个产品的作用是自动提取视力筛查过程中得到的屈光检查数据,并结合数据自动生成通俗易懂且专业的电子报告,以方便家长可以通过公......
  • JavaScript学习笔记—DOM:操作class
    element.classList是一个对象,对象中提供了对当前元素的类的各种操作方法element.classList.add()向元素中添加一个或多个classelement.classList.remove()移除元素中......
  • 代码随想录算法训练营Day5 数组、链表复习
    数组部分数组最重要的思维方式是双指针的使用。快慢指针在进行元素移除和元素操作时会使用两个for循环嵌套,此时时间复杂度为O(n²)。在for循环中通过双指针(快慢指针)的使......
  • 一维/二维数组和普通/对称/三角/三对角/稀疏矩阵的存储
    文章目录​​1数组​​​​1.1一维数组​​​​1.2二维数组​​​​2矩阵​​​​2.1普通矩阵​​​​2.2特殊矩阵​​​​2.2.1对称矩阵​​​​2.2.1.1策略1​​......
  • 【JavaScript】3_深挖数据类型
    4、其他的数据类型布尔值(Boolean)-布尔值主要用来进行逻辑判断-布尔值只有两个true和false-使用typeof检查......
  • php去掉一维数组的键值的实例方法
    在PHP中,数组的每个元素都是由键值对(key-value)组成,通过元素的键名来访问对应键的值。提示:“索引”和“键名”指的是同一样东西,“索引”多指数组数字形式的下标。有时......
  • 数组结构的超简单介绍
    有限个相同类型的变量组成的有序集合叫做数组,其中数组的下标是从0开始的在存储方式上,会创建连续的内存空间存放一组类型相同的数据从0开始是计算效率考虑下面定义一个数......
  • 数组
    数组数组的定义数组是相同类型数据的有序集合数组描述的是相同类型的若干个数据,按照一定的先后次序排列组合而成其中,每个数据称作一个数组元素,每个数组元素可以通过一......
  • 合并两个有序数组(思维过程)
    题目:给你两个按非递减顺序排列的整数数组nums1和nums2,另有两个整数m和n,分别表示nums1和nums2中的元素数目。请你合并nums2到nums1中,使合并后的数组同......