集团官网
  • 国家级全民数字素养与技能培训基地
  • 河南省第一批产教融合型企业建设培育单位
  • 郑州市数字技能人才(码农)培养评价联盟

JavaScript数组的常用方法

编辑:云和数据 日期:2022-12-16 16:18

数组是JavaScript中最常用的数据类型之一,为此Array对象中提供了许多内置方法,如栈方法、检索方法、数组转字符串的方法等。本节将针对数组的常用方法进行详细讲解。

栈方法

JavaScript中,除了前面讲解的添加与删除数组元素的方式外,还可以利用Array对象提供的栈方法实现在数组的末尾或开头添加数组的新元素,也称为入栈;在数组的末尾或开头删除数组元素,也称为出栈。具体如表3-1所示。
1648198585080_101.png

表3-1中需要注意的是,push()和unshift()方法的返回值是新数组的长度,而pop()和shift()方法返回的是移出的数组元素。

为了更好地理解数组元素栈方法的使用,接下来通过案例3-6进行演示。【例3-6】demo06.html

从上述代码可以看出,push()和unshift()方法可以为指定数组在末尾或开头添加一个或多个元素,而pop()和shift()方法则只能移出并返回指定数组在末尾或开头的一个元素。输出结果如图3-12所示。

1.检索方法

在开发中,若要检测给定的值是否是数组,或是查找指定的元素在数组中的位置,则可以利用Array对象提供的检索方法,具体如表3-2所示。

1648198917666_103.png

表3-2中除了Array.isArray()方法外,其余方法默认都是从指定数组索引的位置开始检索,并且检索方式与运算符“===”相同,即只有全等时才会返回比较成功的结果。为了初学者更好的理解这些方法的使用,下面通过代码和案例进行演示。

(1)includes()和Array.isArray()方法

var data = ['peach', 'pear', 26, '26','grape'];// 从数组下标为3的位置开始检索数字26console.log(data.includes(26,3));     // 输出结果:false// 从数组下标为data.length -3 的位置查找数字26console.log(data.includes(26, -3));     // 输出结果:true// 判断变量data是否为数组console.log(Array.isArray(data));     // 输出结果:true

在上述代码中,includes()方法在使用时,第1个参数表示待查找的值,第2个参数用于指定在数组中查找的索引下标,当其值大于数组长度时,数组不会被检索,直接返回false;若将下标设置为小于0的数时,则检索的下标位置等于数组长度加上指定的负数,若结果仍是小于0的数,则检索整个数组。

(2)indexOf()方法

indexOf()用于在数组中从指定下标位置,检索到的第一个给定值,存在则返回对应的元素下标,否则返回-1。下面以判断一个元素是否在指定数组中,若不在则更新数组为例进行讲解。如例3-7所示。【例3-7】demo07.html

上述第2行代码用于创建待检索的数组arr,第3行利用search变量保存需要检索的值,第4~9行代码用于检索arr数组中是否含有search元素,若没有则执行第5~6行代码,在arr数组末尾添加该元素,效果如图3-13左侧所示;若有则执行第8行代码,在控制台输出对应的提示信息,如将search的值设置为tomato时,效果如图3-13右侧所示。

1648198398417_104.png

图3-13indexOf()方法示例

值得一提的是,indexOf()方法的第2个参数用于指定开始查找的下标,当其值大于或等于数组长度时,程序不会在数组中查找,直接返回-1;当其值为负数时,查找的下标位置等于数组长度加上指定的负数,若结果仍是小于0的数,则检索整个数组。

(3)lastIndexOf()方法

Array对象提供的lastIndexOf()方法,用于在数组中从指定下标位置检索到的最后一个给定值的下标。与indexOf()检索方式不同的是,lastIndexOf()方法默认逆向检索,即从数组的末尾向数组的开头检索。接下来以找出指定元素出现的所有位置为例进行讲解。如例3-8所示。【例3-8】demo08.html

上述第2行初始化的res变量,用于保存指定元素出现的所有索引下标。第5行用于获取arr数组中search变量最后一次出现的位置,第6~9行通过循环获取search变量出现的所有位置。其中,第7行用于从res数组的末尾添加找到的元素下标,第8行通过判断当前的下标是否大于0,确定arr中是否还有元素,若结果为true,则下标值i减1,继续从指定位置向前检索变量search的值最后一次出现的下标,直到检索完数组,将i设置为-1结束循环。输出结果如图3-14所示。

1648198386184_105.png

图3-14lastIndexOf()方法的示例

值得一提的是,lastIndexOf()方法的第2个参数用于指定查找的下标,且由于其采用逆向的方式检索,因此当其值大于或等于数组长度时,则整个数组都会被查找。当其值为负数时,则索引位置等于数组长度加上给定的负数,若其值仍为负数,则直接返回-1。

2.数组转字符串

在项目开发中,若需要将数组转换为字符串,则可以利用JavaScript提供的join()和toString()方法实现。具体如表3-3所示。

表3-3数组转字符串

1648198371452_107.png

为了让大家更加清楚的了解数组转字符串的使用,下面通过示例的方式演示。

console.log(['a','b','c'].join());    // 输出结果:a,b,cconsole.log([[4,5],[1,2]].join('-')); // 输出结果:4,5-1,2console.log(['a','b','c'].toString());// 输出结果:a,b,cconsole.log([[4,5],[1,2]].toString());// 输出结果:4,5,1,2

从上述代码可知,join()和toString()方法可将多维数组转为字符串,默认情况下使用逗号连接。不同的是,join()方法可以指定连接数组元素的符号。另外,当数组元素为undefined、null或空数组时,对应的元素会被转换为空字符串。

3.其他方法

除了前面讲解的几种常用方法外,JavaScript还提供了很多其他常用的数组方法。例如,合并数组、数组浅拷贝、颠倒数组元素的顺序等。具体如表3-4所示。

表3-4其他方法

1648198344127_其他方法.jpg

表3-4中的slice()和concat()方法在执行后返回一个新的数组,不会对原数组产生影响,剩余的方法在执行后皆会原数组产生影响。

接下来,以splice()方法为例演示如何在指定位置添加或删除数组元素。如例3-9所示。

【例3-9】demo09.html

在上述代码中,splice()方法的第1个参数用于指定添加或删除的下标位置;第2个参数用于从指定下标位置开始,删除数组元素的个数,将其设置为0,则表示该方法只添加元素。剩余的参数表示要添加的数组元素,若省略则表示删除元素。效果如图3-15所示。

1648198298217_108.png

图3-15splice()方法添加或删除数组元素

值得一提的是,splice()方法的第1个参数的值等于或大于数组长度时,从数组末尾开始操作;当该值为负数时,则下标位置等于数组长度加上指定的负数,若其值仍为负数,则从数组的开头开始操作。

相关内容

抢先一步 鸿蒙(HarmonyOS)应用开发者高级认证 免费考! 适合人群计算机相关专业在校生(技师、中职、高职、本科、研究生)对鸿蒙(HarmonyOS)有兴趣的非计算机相关专业在校生目前正在从事移动应用的开发者目前正在从事计算机行业相关的人计算机专业高校老师所有对鸿蒙(HarmonyOS)有兴趣的人 培训方案掌握鸿蒙的核心概念和端云一体化开发、... 什么是Java的多态性(polymorphism)?它有哪些不同的形式? 多态性是Java面向对象编程的一个重要概念,它允许不同的对象以一致的方式响应同一个方法调用,具体表现为对象在运行时可以表现出多个不同的形态。多态性主要有两种不同的形式:编译时多态性(静态多态性)和运行时多态性(动态多态性)。1. 编译时多态性(静态多态性):   ... 如何学习和搭建Hadoop开发环境? Hadoop是大数据处理领域的重要平台,能够处理和分析大量数据。为了有效地利用Hadoop,我们需要学习其基础知识,并正确搭建开发环境。下面是详细的学习和搭建指南。一、学习Hadoop基础掌握基础概念和原理Hadoop主要由HDFS和MapReduce两部分组成。HDFS是分布式文件系统,Ma... UI 设计学习如何进阶成为高手 我总结了六种方法,帮助你走出舒适区,提高技能,成长为自信且经验丰富的UI设计高手一位经验丰富的 UI 设计师,往往十分看中应用程序界面的吸引力和视觉刺激,确保满足用户期望和需求。但是,如果你已经在 UI 设计圈摸爬滚打多年,仍然没有出色的作品,那你极有可能是因为陷入了一个舒适圈,UI技能一直原... 在Java中Executor和Executors的区别? 在Java中,Executor和Executors都与线程池和并发执行有关,但它们是不同的概念和类。1.ExecutorExecutor是一个接口,位于java.util.concurrent包中,用于表示一个执行任务的执行器。它只定义了一个方法:void execute(Runnable c... String类型的常见命令有哪些? String类型,也就是字符串类型,是Redis中最简单的存储类型。其value是字符串,不过根据字符串的格式不同,又可以分为3类:string是普通字符串,int整数类型,可以做自增、自减操作,float浮点类型,可以做自增、自减操作。String的常见命令有:SET:添加或者修改已经存在的...