JavaScrip数组删除特定元素的几种方法总结
从js数组中删除指定元素是我们每个人都遇到的问题,网上这方面的资料也很多,但有的时间过于久远,有的内容不够全面,所以自己来整理下,这篇文章主要给大家总结介绍了关于JavaScrip数组删除特定元素的多种方法,需要的朋友可以参考下。
前言
可能一说到删除数组特定元素你估计不止一种方法可以实现,那么下面且来看看我总结的这几种方法,可能会对你有所帮助!话不多说了,来一起看看详细的介绍吧。
源数组
var arr = ["George", "John", "Thomas", "James", "Adrew", "Martin"];
伪删除
什么是伪删除呢? 就是说将数组元素值设置为null;
arr[ arr.indexOf( 'Thomas' ) ] = null;
删除后的数组是这个样子的:
["George", "John", null, "James", "Adrew", "Martin"]
不过要注意, 这意味着数组Array也就是变量arr的长度保持不变
完全删除
是什么是完全删除呢? 这个问题你可能从字面上也能想得到就是真正的删除数组Array的元素值, 并且会改变数组的长度, 可以通过内置数组对象Array的splice方法来实现这个需求!说到splice这个方法就要说一说它的具体参数了:
Array.prototype.splice = function(start,deleteCount,items) {};
上面是内置对象Array的splice方法原型定义, 中文意思呢是:剪接, 其参数的意义是:
start: 起点索引值
deleteCount: 要删除的元素个数
items: 删除后替换/追加的元素
参数不加时就表示删除元素, 并且还要结合 deleteCount 的参数值
如果 deleteCount 为 1, items 参数位置给一个参数值, 则表示替换
如果 deleteCount 为 1, items 参数位置给多于一个的参数值, 则表示替换及追加元素
通过splice方法删除上面 伪删除 留下的元素值 null
arr.splice( arr.indexOf( null ), 1 );
删除后的数组是这个样子的:
["George", "John", "James", "Adrew", "Martin"]
既然说到了splice方法就顺便再说一下它的其它功能, 如 替换元素, 追加元素 等操作吧!
splice函数 - 替换元素
现在数组结构是这样的:
["George", "John", "James", "Adrew", "Martin"]
想要将数组元素 James 替换为 Tom
arr.splice( arr.indexOf( 'James' ), 1, 'Tom' );
替换后的数组结构是这个样子的:
["George", "John", "Tom", "Adrew", "Martin"]
splice函数 - 替换并追加元素
现在当前数组结构是这样的:
["George", "John", "Tom", "Adrew", "Martin"]
想要将数组元素 Tom 替换为 Judy 并追加 Linda 和 Alisa
arr.splice( arr.indexOf( 'Tom' ), 1, 'Judy', 'Linda', 'Alisa' );
替换及追加后的数组结构是这个样子的:
["George", "John", "Judy", "Linda", "Alisa", "Adrew", "Martin"]
splice函数 - 追加元素
追加元素你可以选择任意位置这取决于你的具体需求, 关键是在于 start 的取值索引位置而已!当前数组结构如下所示:
["George", "John", "Judy", "Linda", "Alisa", "Adrew", "Martin"]
比如说要在 Linda 和 Alisa 之间追加 Bill 和 Blake
arr.splice( arr.indexOf( 'Linda' ) + 1, 0, 'Bill', 'Blake' );
追加后的数组结构是下面这个样子的:
["George", "John", "Judy", "Linda", "Bill", "Blake", "Alisa", "Adrew", "Martin"]
起点位置
arr.indexOf( 'Linda' ) + 1
就是在数组元素 Linda 之后了删除元素个数参数这里设置的是 0 这个是追加元素的关键, 也就是说不删除元素
'Bill', 'Blake' 这个呢就是内置对象Array的splice方法的最后一个参数 items 它表示0个是和多个, 根据 deleteCount 参数值不同表示的含义也会不同, 这里 deleteCount 参数是 0 并且 items 又有两个值来表示这个参数, 所示说就是追加元素值 'Bill', 'Blake'
以上说的是删除数组中特定的元素, 那删除第一个元素和最后一个元素那实现在是太简单了, 这里简单提一下就是了
删除数组中第一个元素
arr.shift();
删除后的数组是这个样子的:
["John", "Judy", "Linda", "Bill", "Blake", "Alisa", "Adrew", "Martin"]
删除数组中最后一个元素
arr.pop();
删除后的数组是这个样子的:
["John", "Judy", "Linda", "Bill", "Blake", "Alisa", "Adrew"]
以上就是本篇文章的所有内容,希望对大家学习JavaScript提供到帮助!!
JavaScript观察者模式实例详解
以上是JavaScrip数组删除特定元素的几种方法总结的详细内容。更多信息请关注PHP中文网其他相关文章!

热AI工具

Undresser.AI Undress
人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover
用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool
免费脱衣服图片

Clothoff.io
AI脱衣机

AI Hentai Generator
免费生成ai无尽的。

热门文章

热工具

记事本++7.3.1
好用且免费的代码编辑器

SublimeText3汉化版
中文版,非常好用

禅工作室 13.0.1
功能强大的PHP集成开发环境

Dreamweaver CS6
视觉化网页开发工具

SublimeText3 Mac版
神级代码编辑软件(SublimeText3)

热门话题

数组是一种线性顺序数据结构,用于在连续的内存位置中保存同质数据。与其他数据结构一样,数组也必须具备以某种有效方式插入、删除、遍历和更新元素的功能。在C++中,我们的数组是静态的。C++中还提供了一些动态数组结构。对于静态数组,该数组内可能存储Z个元素。到目前为止,我们已经有n个元素了。在本文中,我们将了解如何在C++中在数组末尾插入元素(也称为追加元素)。通过示例理解概念‘this’关键字的使用方式如下GivenarrayA=[10,14,65,85,96,12,35,74,69]Afterin

CSS变形:如何实现元素的旋转效果,需要具体代码示例在网页设计中,动画效果是提高用户体验和吸引用户注意力的重要方式之一,而旋转动画是其中比较经典的一种。在CSS中,使用“transform”属性可以实现元素的各种变形效果,包括旋转。本文将详细介绍如何利用CSS的“transform”实现元素的旋转效果,并提供具体的代码示例。一、如何使用CSS的“transf

javafx.scene.shape包提供了一些类,您可以使用它们绘制各种2D形状,但这些只是原始形状,如直线、圆形、多边形和椭圆形等等...因此,如果您想绘制复杂的自定义形状,您需要使用Path类。Path类Path类使用此表示形状的几何轮廓您可以绘制自定义路径。为了绘制自定义路径,JavaFX提供了各种路径元素,所有这些都可以作为javafx.scene.shape包中的类使用。LineTo-该类表示路径元素line。它可以帮助您从当前坐标到指定(新)坐标绘制一条直线。HlineTo-这是表

CSS过渡效果:如何实现元素的滑动效果引言:在网页设计中,元素的动态效果能够提升用户体验,其中滑动效果是一个常见而又受欢迎的过渡效果。通过CSS的过渡属性,我们可以轻松实现元素的滑动动画效果。本文将介绍如何使用CSS过渡属性来实现元素的滑动效果,并提供具体的代码示例,以帮助读者更好地理解和应用。一、CSS过渡属性transition的简介CSS过渡属性tra

您系统上的 OneDrive 应用程序将所有文件和文件夹存储在云端。但有时用户不希望某些文件或文件夹被存储并占用限制为 5 GB 的 OneDrive 空间而无需订阅。为此,OneDrive 应用程序中有一个设置,允许用户选择要在云上同步的文件或文件夹。如果您也在寻找这个,那么这篇文章将帮助您在 Windows 11 系统的 OneDrive 中选择要同步的文件夹或文件。如何在 Windows 11 的 OneDrive 中选择要同步的某些文件夹注意:确保 OneDrive 应用程序已连接并同步

html5不支持的元素有纯表现性元素、基于框架的元素、应用程序元素、可替换元素和旧的表单元素。详细介绍:1、纯表现性的元素,如font、center、s、u等,这些元素通常被用于控制文本样式和布局;2、基于框架的元素,如frame、frameset和noframes,这些元素在过去用于创建网页布局和分割窗口;3、应用程序相关的元素,如applet和isinde等等。

如何使用HTML和CSS实现一个具有固定导航菜单的布局在现代网页设计中,固定导航菜单是常见的布局之一。它可以使导航菜单始终保持在页面顶部或侧边,使用户可以方便地浏览网页内容。本文将介绍如何使用HTML和CSS实现一个具有固定导航菜单的布局,并提供具体的代码示例。首先,需要创建一个HTML结构来呈现网页的内容和导航菜单。以下是一个简单的示例

如何使用CSS实现元素的透明度渐变效果在Web开发中,为网页元素添加过渡效果是提升用户体验的重要手段之一。透明度的渐变效果不仅可以使页面变得更加平滑,还可以突出元素的重点内容。本文将介绍如何使用CSS实现元素的透明度渐变效果,并提供具体的代码示例。使用CSS的transition属性要实现元素的透明度渐变效果,我们需要使用CSS的transition属性。t
