在 javascript 中如何快速获取数组指定位置的元素
更新时间：2023年04月25日 17:05:06 作者：zjl_712、
这篇文章主要介绍了在 javascript 中快速获取数组指定位置的元素,本文通过实例代码给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下
前言
在 JavaScript 中如果我们需要获取一个数组指定位置的元素，通常情况下，我们一般采用以下方法：
1.通过下标直接获取指定元素：arr[index], index 为非负数。
let arr = [1, 4, 5, 8, 10] // 获取数组的第一个元素 let num1 = arr[0] // 获取数组的最后一个元素 let num2 = arr[arr.length - 1] // 获取数组的倒数第二个元素 let num3 = arr[arr.length - 2] console.log(num1, num2, num3); // 1 10 8
根据正序位置获取指定的元素比较方便，但是根据逆序位置（倒数第几个）获取指定的元素稍微繁琐（需要计算出正序位置）。
正序时 index 为正整数或0，逆序时 index 为负整数。
那么获取对应位置元素的表达式可以表示为：
index 为正数或0：arr[index]
index 为负数： arr[arr.length + index]
2.通过 slice 方法获取
let arr = [2, 4, 6, 8, 10] // 获取数组的第一个元素 let num4 = arr.slice(0, 1) // 获取数组的最后一个元素 let num5 = arr.slice(-1) // 获取数组的倒数第二个元素 let num6 = arr.slice(-2, -1) console.log(num4[0], num5[0], num6[0]); // 2 10 8
其实在其他语言中比如 python 如果你想要获取倒数第几个元素是可以通过 arr[index] 直接获取（如arr[-1]获取倒数第一个元素）, 但是在 JavaScript 中是不支持这样获取的。
为了更方便获取数组指定位置的元素（无论时正序还是逆序位置），数组提供了一个内置方法 at() 可以通过元素下标直接获取指定位置的数组元素
数组的 at() 方法
我们使用 at 方法实现以上案例：
let arr2 = [2, 4, 6, 8, 10] // 获取数组的第一个元素 let num4 = arr2.at(0) // 获取数组的最后一个元素 let num5 = arr2.at(-1) // 获取数组的倒数第二个元素 let num6 = arr2.at(-2) console.log(num4, num5, num6); // 2 10 8
语法：at(index), index 是整数，其中包括负整数表示从左往右数第几个元素。
获取指定位置不存在的元素返回 undefined
let arr = [2, 4, 6, 8, 10] console.log(arr[5]); // undefined
获取类数组指定位置元素
let likeArr = {
length: 2,
0: 'vue',
1: 'react'
}
let lang = Array.prototype.at.call(likeArr, 0)
console.log(lang); // vue对比
| 方法 | 参数范围 | 简易程度 |
|---|---|---|
| arr[index] | 非负整数 | 逆序获取元素时需要进行计算，相对繁琐 |
| slice(startIndex, endIndex) | 整数 | 一般需要一到两个下标，相对繁琐 |
| at(index) | 整数 | 只需一个下标 index ，相对简单 |
到此这篇关于在 javascript 中快速获取数组指定位置的元素的文章就介绍到这了,更多相关js获取数组指定位置的元素内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！
相关文章
下面小编就为大家分享一篇解决低版本的浏览器不支持es6的import问题，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2018-03-03
JavaScript运行机制之事件循环(Event Loop)详解
这篇文章主要介绍了JavaScript运行机制之事件循环(Event Loop)详解,本文从多个方面讲解了Event Loop,需要的朋友可以参考下2014-10-10
这篇文章主要介绍了JS金额小写转大写的方法,需要的朋友可以参考下2014-05-05
这篇文章主要给大家介绍了如何通过一篇文章让你轻松记住js的隐式转化的相关资料,通过在各种情况下发生的隐式类型的例子,来详细的了解隐式类型转换的过程,需要的朋友可以参考下2022-01-01
在实际的应用开发中，我们会常常用到JS的模事件，比如说点击事件，举个简单的例子，点击表单外的“提交”按钮来提交表单。上代码吧2012-11-11
这篇文章主要为大家详细介绍了JavaScript的事件流，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下，希望能够给你带来帮助2022-03-03
写代码的时候总有一些东西是会重复出现的,次数多了你就会想找找捷径了,下面这篇文章主要给大家介绍了关于5个JavaScript的写法小技巧,文中通过实例代码介绍的非常详细,需要的朋友可以参考下2022-02-02
这篇文章主要介绍了基于p5.js实现色彩轮和饼状图的动态可视化,文中给出了详细的代码,它适用于需要展示颜色信息或数据分布情况的场景,如设计、数据分析和教育领域,感兴趣的朋友可以参考下2024-06-06
这篇文章主要为大家详细介绍了js实现随机点名小功能，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2017-08-08
这篇文章主要介绍了javascript 删除所有事件监听器,文中还通过示例代码介绍了javaScript删除对象属性总结方法，结合示例代码给大家介绍的非常详细，需要的朋友可以参考下2023-06-06
最新评论