javascript数组的内置方法详解

2024-12-24 02:23:42

1.Array.at()

功能：接受一个整数值并返回该索引处的项目，允许正整数和负整数。负整数从数组中的最后一项开始计数。

语法：Array.at(index)

参数：index：要返回的数组元素的索引（位置）。当传递一个负索引时，支持从数组末尾开始相对索引；即，如果使用负数，将通过从数组末尾开始倒数来找到返回的元素。

返回值：数组中与给定索引匹配的元素。undefined如果找不到给定的索引，则返回

<script type="text/javascript">
			var arr = [1,2,3,4,5];
			var newarr = arr.at(-1);
			console.log(newarr);// 5
			var newarr = arr.at(3);
			console.log(newarr);// 4
</script>

2. Array.copyWithin()

功能：浅复制数组的一部分到同一数组中的另一个位置，并返回它，不会改变原数组的长度。

语法：arr.copyWithin(target[, start[, end]])

参数：

target:

0 为基底的索引，复制序列到该位置。如果是负数，target 将从末尾开始计算。

如果 target 大于等于 arr.length，将会不发生拷贝。如果 target 在 start 之后，复制的序列将被修改以符合 arr.length。

start:

0 为基底的索引，开始复制元素的起始位置。如果是负数，start 将从末尾开始计算。

如果 start 被忽略，copyWithin 将会从0开始复制。

end:

0 为基底的索引，开始复制元素的结束位置。copyWithin 将会拷贝到该位置，但不包括 end 这个位置的元素。如果是负数， end 将从末尾开始计算。

如果 end 被忽略，copyWithin 方法将会一直复制至数组结尾（默认为 arr.length）

<script type="text/javascript">
			var arr = [1,2,3,4,5];
			var arr2= arr.copyWithin(-2)
			console.log(arr2); // [1, 2, 3, 1, 2]
			var arr3= arr.copyWithin(0, 3)
			console.log(arr3); // [4, 5, 3, 4, 5]
			var arr4= arr.copyWithin(0, 3, 4)
			console.log(arr4); // [4, 2, 3, 4, 5]
			var arr5= arr.copyWithin(-2, -3, -1)
			console.log(arr5); // [1, 2, 3, 3, 4]
</script>

3. Array.entries()

功能：返回一个新的Array Iterator对象，该对象包含数组中每个索引的键/值对。

语法：arr.entries()

返回值：一个新的 Array 迭代器对象。Array Iterator是对象，它的原型（__proto__:Array Iterator）上有一个next方法，可用用于遍历迭代器取得原数组的[key,value]。

<script type="text/javascript">
			var array1 = ['a', 'b', 'c'];
			var iterator1 = array1.entries();
			console.log(iterator1.next().value);
			// expected output: Array [0, "a"]
			console.log(iterator1.next().value);
			// expected output: Array [1, "b"]
</script>

4. Array.fill()

功能：用一个固定值填充一个数组中从起始索引到终止索引内的全部元素。不包括终止索引。

语法：arr.fill(target[, start[, end]])

参数：

value：用来填充数组元素的值。
start ：可选，起始索引，默认值为0。
end ：可选，终止索引，默认值为 this.length。

返回值：修改后的数组

<script type="text/javascript">
			var array1 = [1, 2, 3, 4];
			// fill with 0 from position 2 until position 4
			console.log(array1.fill(0, 2, 4));
			// expected output: [1, 2, 0, 0]
			// fill with 5 from position 1
			console.log(array1.fill(5, 1));
			// expected output: [1, 5, 5, 5]
			console.log(array1.fill(6));
			// expected output: [6, 6, 6, 6]
</script>

5.find()

功能：返回数组中满足提供的测试函数的第一个元素的值。否则返回 undefined。

语法：arr.find(callback[, thisArg])

参数：

callback：在数组每一项上执行的函数，接收 3 个参数：
element：当前遍历到的元素。
index：可选，当前遍历到的索引。
array：可选，数组本身。
thisArg可选，执行回调时用作this 的对象。

返回值：数组中第一个满足所提供测试函数的元素的值，否则返回 undefined。

<script type="text/javascript">
			var array1 = [5, 12, 8, 130, 44];
			var found = array1.find(element => element > 10);
			console.log(found); // 12
</script>

总结

本篇文章就到这里了，希望能够给你带来帮助，也希望您能够多多关注我们的更多内容！

JavaScript数组方法-系统性总结详解

目录数组常用方法数组元素增添和删除操作数组头部操作数组尾部任意位置增删数组拼接数组转换成字符串截取数组数组排序方法排序顺序翻转数组迭代方法数组遍历查找返回值为下标返回值为内容数组遍历处理 callback(value[,index[,array]]) callback(total,value[,index[,array]]) 数组其他方法总结首先总结的意义就是让杂乱无章变得更加井然有序,这样在使用的过程思路会更加清晰. 数组使用方法注意点: 变异方法和非变异方
JavaScript中常用的数组操作方法

目录一.concat() 二.join() 三.push() 五.shift() 六.unshift() 七.slice() 八.splice() 九.substring() 和 substr() 十.sort 排序十一.reverse() 十二.indexOf 与 lastIndexOf 十三.every 对数组十四.some 十五.filter 十六.map 十七.forEach 数组遍历 1.find(): 2.findIndex(): 3.fill(): 4.copyWithin(
JS利用map整合双数组的小技巧分享

目录前言模拟数据合并后数据合并思路代码展示&解析第一步第二步第三步第四步全部代码总结前言最近因公司业务需求编写ECharts图表展示相关公司阶段型业务相关数据变化,需要服务端进行数据查询返回给前端进行数据展示.但是由于反回的数据不便于前端 ECharts展示所以需要进行数据整合,奈何本人经验不足只能请教公司大佬,在大佬帮助下完成了数据整合,并学到一个前所未闻的合并方法今天分享给大家. 模拟数据下图是将要被合并的两数组合并后数据合并后数据要求以时间为唯一的key进行
常用的JavaScript数组方法

目录 1.filter() 2.forEach() 3.some() 4.every() 5.reduce() 6.合并数组 1.filter() 语法: array.filter(function(currentValue,index,arr), thisValue) 参数说明: currentValue:当前元素对象(必选) index:当前元素的索引值(可选) arr:当前元素属于的数组对象(可选) thisValue:对象作为该执行回调时使用,传递给函数,用作 "this" 的
JavaScript数组详细归纳

目录一.数组归纳 1. 字符串拆分为数组 2. 将集合和映射转换为新数组 3. 对现有数组进行浅复制 4. arguments 对象轻松转换为数组 5. 转换自定义对象二.迭代器方法三.数组常用操作方法一.数组归纳 1. 字符串拆分为数组 console.log(Array.form("red")) // ["r", "e", "d"] 2. 将集合和映射转换为新数组 const a1 = new Map().set(
JavaScript数组常用方法实例讲解总结

目录数组常用方法 concat() 方法 join() 方法 pop() 方法 push() 方法 reverse() 方法 shift() 方法 slice() 方法 sort() 方法 splice() 方法 toSource() 方法 toString() 方法 toLocaleString() 方法 unshift() 方法 valueOf() 方法导读:在实际开发中,前端工程师除了写页面布局及样式还要对后端返回的数据进行处理,返回的数据大多数是json格式,一般都是返回一个对象或者
JavaScript数组合并案例讲解

方法一: var a = [1,2,3]; var b=[4,5] a = a.concat(b); console.log(a); //此处输出为 [1, 2, 3 ,4 ,5] 方法二: // ES5 的写法 var arr1 = [0, 1, 2]; var arr2 = [3, 4, 5]; Array.prototype.push.apply(arr1, arr2); console.log(arr1)//[0,1,2,3,4,5] 方法三: // ES6 的写法 var arr1 =
javascript数组的内置方法详解

目录 1.Array.at() 2. Array.copyWithin() 3. Array.entries() 4. Array.fill() 5.find() 总结 1.Array.at() 功能:接受一个整数值并返回该索引处的项目,允许正整数和负整数.负整数从数组中的最后一项开始计数. 语法:Array.at(index) 参数:index:要返回的数组元素的索引(位置).当传递一个负索引时,支持从数组末尾开始相对索引:即,如果使用负数,将通过从数组末尾开始倒数来找到返回的元素. 返回值:
Python序列对象与String类型内置方法详解

本文实例讲述了Python序列对象与String类型内置方法.分享给大家供大家参考,具体如下: 前言在Python数据结构篇中介绍了Python的序列类型数据结构,这次继续深入的学习序列和String类型对象的内建方法. 软件环境系统 UbuntuKylin 14.04 软件 Python 2.7.3 IPython 4.0.0 序列类型序列类型,即由整数进行索引的对象的有序集合.其中又可以分为下面两类: 可变序列:列表,支持元素的插入.删除.替换不可变序列:元组.字符串序列的操作方法
JavaScript数组排序reverse()和sort()方法详解

JavaScript中数组排序的方法有两个reverse()和sort(). reverse()方法会反转数组项的顺序: var arr = [1,2,3,4,5]; arr.reverse(); alert(arr); //5,4,3,2,1 sort()方法会按照字符串升序排列数组项,sort()方法会调用每个数组项的tostring()方法,即使数组中的每一项都是数值,sort()方法比较的也是字符串: var arr = [1,2,11,15,5]; arr.sort(); alert(
对python中的for循环和range内置函数详解

如下所示: 1.for循环和range内置函数配合使用 range函数生成一个从零开始的列表, range(4)表示list:0123 range(1,11,2)表示从1开始到11-1为止步长为2的list:13579 即range(i)表示从0开始到i-1的列表,range(m,n)表示从m开始到n-1的列表,range(m,n,t)表示从m开始步长为t到n-1的列表 ''' print('第一次循环输出:') for i in range(4): print(i) print('第二次循环输
JS合并两个数组的3种方法详解

这篇文章主要介绍了JS合并两个数组的3种方法详解,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下需要将两个数组合并成为一个的情况.比如: var a = [1,2,3]; var b = [4,5,6]; 有两个数组a.b,需求是将两个数组合并成一个.方法如下: 1.concat js的Array对象提供了一个叫concat()方法,连接两个或更多的数组,并返回结果. var c = a.concat(b); //c=[1,2,3,4,5,6]
利用JavaScript获取用户IP属地方法详解

目录写在前面尝试一:navigator.geolocation 尝试二:sohu 的接口尝试三:百度地图的接口写在后面写在前面想要像一些平台那样显示用户的位置信息,例如某省市那样.那么这是如何做到的, 据说这个位置信息的准确性在通信网络运营商那里?先不管,先实践尝试下能不能获取. 尝试一:navigator.geolocation 尝试了使用 navigator.geolocation,但未能成功拿到信息. getGeolocation(){ if ('geolocation' in
Java postgresql数组字段类型处理方法详解

在实际开发中遇到postgresql中定义的数组字段,下面解决两个问题,如何定义数组字段的默认值为空格数组,以及如何再java实体类中直接使用数组对象接受数据或把数据存入数据库. 1.在postgresql中定义数组对象及默认值以字符串你数组为例: 比如一个字段用于存储多张图片的url,可以使用一下sql定义 pictures _varchar NOT NUll default ARRAY[]::character varying[] 2.实体类存入数组到数据库并接受数据库的数组数据直接定义
vue内置指令详解

指令 (Directives) 是带有 v- 前缀的特殊属性, 职责是,当表达式的值改变时,将其产生的连带影响,响应式地作用于 DOM. 内置指令 1.v-bind:响应并更新DOM特性:例如:v-bind:href v-bind:class v-bind:title 等等主要用法是绑定属性,动态更新HTML元素上的属性: <a v-bind:href="url" rel="external nofollow" rel="external n
JavaScript面向对象中接口实现方法详解

本文实例讲述了JavaScript面向对象中接口实现方法.分享给大家供大家参考,具体如下: 接口是面向对象编程的基础,它是一组包含了函数型方法的数据结构,与类一样,都是编程语言中比较抽象的概念.比如生活中的接口,机顶盒,人们利用它来实现收看不同频道和信号的节目,它犹如对不同类型的信息进行集合和封装的设备,最后把各种不同类型的信息转换为电视能够识别的信息.在编程语言中的接口,实际上是不同类的封装并提供统一的外部联系通道,这样其他对象就可以利用接口来调用不同类的成员了. --整理自<jQuery开发
Struts2中ognl遍历数组,list和map方法详解

一.简介 <s:iterator />可以遍历数据栈里面的任何数组,集合等等在使用这个标签的时候有三个属性值得我们关注 1. value属性:可选的属性,value属性是指一个被迭代的集合,使用ognl表达式指定,如果为空的话默认就是ValueStack栈顶的集合. 2.id属性:可选属性, 是指集合元素的id 3.status属性:可选属性,该属性在迭代时会产生一个IteratorStatus对象,该对象可以判断当前元素的位置,包含了以下属性方法: int getCount(); 迭代元素