如何利用splice()和slice()方法操作数组

news2024/12/26 23:41:05

如何利用splice()和slice()方法操作数组

  • 前言
  • splice()是什么,有什么用?怎么用?
  • slice()是什么,有什么用?怎么用?
  • splice和slice方法的区别
  • 小结

前言

splice()和slice()都是JavaScript中操作数组的方法,到底怎么用?什么时候用?有什么区别?今天把这个问题搞清楚
在这里插入图片描述


splice()是什么,有什么用?怎么用?

splice()用于在数组中进行添加、删除和替换操作,它可以实现以下功能:

功能1:删除数组中的元素
功能2:向数组中添加新元素
功能3:用新元素替换数组中的元素

splice方法的基本语法如下:

array.splice(start, deleteCount, item1, item2, ...)

参数说明:
start:要删除或插入元素的数组下标。
deleteCount:要删除的元素个数,如果该值为0,则不删除任何元素。
item1, item2, …:要插入到数组中的新元素,可以有多个。

在这里插入图片描述

	var arr = ["孙悟空", "猪八戒", "唐僧", "沙和尚"];
	
	//删除元素,从下标2开始删除2个元素
	arr.splice(2, 2);
	console.log(arr); //["孙悟空", "猪八戒"]
	
	//添加元素,从下标1开始添加2个元素
	arr.splice(1, 0, "张麻子", "县长");
	console.log(arr); //["孙悟空", "张麻子", "县长", "猪八戒"]
	
	//替换元素,从下标2开始替换1个元素
	arr.splice(2, 1, "独孤求败");
	console.log(arr); //["孙悟空", "张麻子", "独孤求败", "猪八戒"]

★★★关键点:splice方法会直接修改原数组,如果不想修改原数组,可以先将原数组复制一份再进行操作。


slice()是什么,有什么用?怎么用?

slice()用于从数组中获取指定区间的元素,它可以实现以下功能:

功能1:获取指定区间的元素,不会修改原数组
功能2:拷贝数组的一部分,生成一个新的数组

slice方法的基本语法如下:

array.slice(start, end)

参数说明:
start:要拷贝的起始下标,包括该下标的元素。
end:要拷贝的结束下标,不包括该下标的元素。如果省略该参数,则拷贝从start开始到数组末尾的所有元素。

在这里插入图片描述

	var arr = ["孙悟空", "猪八戒", "唐僧", "沙和尚"];
	
	//获取指定区间的元素,不会修改原数组
	var newArr1 = arr.slice(1, 3);
	console.log(newArr1); //["猪八戒", "唐僧"]
	
	//拷贝数组的一部分,生成一个新的数组
	var newArr2 = arr.slice();
	console.log(newArr2); //["孙悟空", "猪八戒", "唐僧", "沙和尚"]

★★★关键点:slice方法不会修改原数组,而是返回一个新的数组,因此可以通过slice方法来复制一个数组。另外,如果拷贝的起始下标或结束下标为负数,则表示从数组末尾开始计算的位置。


splice和slice方法的区别

splice和slice是JavaScript中的两个数组方法,它们的用法有以下区别:

1.splice方法可以修改原数组,而slice方法不会修改原数组,而是返回一个新的数组。
2.splice方法可以用于删除、添加和替换元素,而slice方法仅用于获取指定区间的元素。

在这里插入图片描述

	var arr = ["孙悟空", "猪八戒", "唐僧", "沙和尚"];
	
	//使用splice方法删除数组中的元素,修改原数组
	arr.splice(1, 2);
	console.log(arr); //["孙悟空", "沙和尚"]
	
	//使用slice方法获取指定区间的元素,不修改原数组
	var newArr = arr.slice(1, 2);
	console.log(newArr); //["沙和尚"]
	console.log(arr); //["孙悟空", "沙和尚"]

我们首先使用splice方法删除了数组中的元素,即从下标1开始删除2个元素,这样修改了原数组。然后我们使用slice方法获取了指定区间的元素,即从下标1开始到下标2之前的元素,这样并没有修改原数组,而是返回了一个新的数组。


小结

在了解了splice和slice的用法时,我们知道一般地:
当我们需要修改原数组时,可以使用splice方法;
当我们需要获取指定区间的元素时,可以使用slice方法。
在这里插入图片描述


本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/507093.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

如今的Android就业率惨不忍睹~

3月底公司大裁员,投了一个月简历,一天投个几十份简历,而收到面试通知的就那么三四家,要么就是薪水给得很低不想去,要么就是高薪水的Offer拿不下,而自己中意公司的却没有给出回应,唉……真难啊!&…

4.2 线性表顺序表

目录 目录结构 线性表 线性表的特征: 顺序表存储结构的表示 顺序表存储结构的特点 顺序存储结构的表示 线性表的基本运算 基本运算的相关算法 线性表的基本运算 线性表 目录结构 线性表 线性表是包含若干数据元素的一个线性序列 记为: L(a0, …

Istio virtual service 故障注入之延时(fixedDelay)、中断(abort)

Istio 故障注入 Istio 故障注入与其他在网络层引入错误(例如延迟数据包或者直接杀死 Pod)的机制不同,Istio 允许在应用程序层注入故障。这使得可以注入更多相关的故障,比如 HTTP 错误代码等。 Istio 可以注入两种类型的故障&…

iLO初识

文章目录 什么是iLO?为什么需要iLO?iLO界面介绍风扇状态温度状态存储控制器的电池组件cpu状态内存状态网络设备列表存储状态固件状态 什么是iLO? iLO(Integrated Lights-Out)是一种远程管理技术,用于管理和…

第7章链接:7.1 编译器驱动程序

示例程序由两个源文件组成,main.c 和 swap.c。 main函数初始化一个两元素的整数数组,然后调用swap函数来交换这一对数。 main.c void swap();int buf[2] {1, 2};int main() {swap();return 0; }swap.c extern int buf[];int *bufp0 &buf[0]; i…

Android系统日志3-trace

1、使用 主要追踪耗时,如上图所示,记录的是traceBegin和traceEnd之间的耗时,这些日志信息可以通过systrace查看 2、获取trace日志 https://developer.android.com/topic/performance/tracing/command-line?hlzh-cn https://developer.andr…

Linux之shell基础(六)

1、shell 简介 shell 介于内核与用户之间,负责命令的编辑,是人机交互的一个桥梁 shell 的种类 [rootyhm ~]# cat /etc/shells /bin/sh /bin/bash /usr/bin/sh /usr/bin/bash /bin/ksh /bin/rksh /usr/bin/ksh /usr/bin/rksh种类说明/bin/shbash的一个…

学习HCIP的day.05

目录 十、ospf扩展配置&#xff1a; 1、认证 2、沉默接口 3、加快收敛 4、缺省路由 查看OSPF路由&#xff1b;显示本地发出和学习到的OSPF路由条目 <r10>display ospf routing 十、ospf扩展配置&#xff1a; 1、认证 直连的邻居或邻接之间&#xff0c;配置身…

【并发编程系列 — 线程基础】

Java并发是Java语言中非常重要的一个话题&#xff0c;也是面试和实际应用中最常接触到的。作为JAVA工程师&#xff0c;掌握并发编程知识是非常重要的。在多核CPU的环境下&#xff0c;使用多线程并发执行任务可以显著提高程序的执行效率&#xff0c;从而提高系统的性能。 目录 …

6.事件系统

事件 事件的传递 新建Widget项目myevent&#xff0c;类名WIdget不变 新建C类如下&#xff1a; 粘贴代码 1myevent运行结果&#xff1a; 输入任意字符时&#xff0c;qDebug显示如下&#xff0c;但框内无法显示输入的字符 //mylineedit.cpp中void MyLineEdit::keyPressEven…

[Docker]Docker命令

Docker常用命令 帮助命令 docker version #版本信息 docker info #详细信息 docker 命令 --help #万能命令镜像命令&#xff1a; docker images #展示所有镜像 docker search docker pull 下载镜像 docker rmi 删除镜像 &#xff08;remove images) 容器命令…

数据分析---Python科学计算库-Numpy学习(一)

一&#xff0c;简介 1.1什么是数据分析 数据分析是指通过使用各种统计学、计算机科学和数学技术&#xff0c;对收集来的数据进行处理、整理、解释和呈现&#xff0c;从而提取出数据中有用的信息和洞察&#xff0c;并帮助做出更明智的决策。数据分析可以应用于各种不同的领域和…

MapReduce源码解读-2

MapReduce源码解读-2 MapReduceInputFormat类getSplitsCreateRecordReader Mapper类OutputCollectorMapOutputBufferPartitioner 分区环形缓冲区 Circular buffer初始化 Spill、Sort溢写、排序Merge 合并combiner 规约 Reduce阶段ReduceTask第一层调用 ReduceTask.run -shuffle…

【力扣】刷题+剑指offer第二版

文章目录 题目收藏不含重复字符的最长子串最长公共子串 剑指 Offer剑指 Offer 05. 替换空格剑指 Offer 03. 数组中重复的数字剑指 Offer 04. 二维数组中的查找剑指 Offer 09. 用两个栈实现队列剑指 Offer 07. 重建二叉树剑指 Offer 06. 从尾到头打印链表剑指 Offer 11. 旋转数组…

【大数据之Hadoop】二十八、生产调优-HDFS集群扩容及缩容

增加或缩减服务器&#xff0c;注意不允许白名单和黑名单同时出现同一个主机。 1 服役新服务器 原有数据节点不能满足数据存储需求时&#xff0c;需要在原有集群的基础上动态增加节点&#xff0c;即动态增加服务器&#xff0c;增加服务器的同时不需要重启集群。 hadoop完全分布…

JVM相关知识点

java内存区域 线程私有的&#xff1a; 程序计数器虚拟机栈本地方法栈 线程共享的&#xff1a; 堆方法区直接内存 程序计数器&#xff1a;记录当前线程执行的位置 当线程切换后能够知道该线程上次运行到哪了 java虚拟机栈&#xff1a; 方法调用的数据通过栈进行传递&#…

一篇文章带你重新回溯单链表的所有

&#x1f349;博客主页&#xff1a;阿博历练记 &#x1f4d7;文章专栏&#xff1a;数据结构与算法 &#x1f69a;代码仓库&#xff1a;阿博编程日记 &#x1f339;欢迎关注&#xff1a;欢迎友友们订阅收藏关注哦 文章目录 &#x1f34c;前言&#x1f4bb;无头单向非循环链表&am…

SSM(Spring、SpringMVC、MyBatis)整合、配置

SpringMVC是一个表述层(前台的页面和后台的servlet)框架&#xff0c;处理浏览器发送到服务器的请求&#xff0c;并且将一些数据响应到浏览器 MyBatis是一个持久层框架&#xff0c;帮助我们连接数据库&#xff0c;访问数据库&#xff0c;操作数据库中的数据 Spring是一个整合型框…

毕业论文相关

毕业论文参考文献和Word保存 一、Word中出现[7-9]多个文献的引用 在正文中选中参考文献角标&#xff0c;右击选择“切换域代码”&#xff0c;参考文献角标[7][8][9]变为{ REF _Ref98345319 \r \h * MERGEFORMAT }{ REF _Ref98345321 \r \h * MERGEFORMAT }{ REF _Ref99390603…

AQS独占锁之ReentrantLock源码调试(JDK8)

前言&#xff1a; 为什么需要学习ReentrantLock? 目前项目开发中使用到的几乎都是分布式锁&#xff0c;平时可能很少用到java自带的锁&#xff1b; 但实际在我们java的源码中&#xff0c;随处可见需要使用锁来保证线程安全&#xff0c;所以还是有必要学习下ReentrantLock。 1…