JavaScript从数组中删除特定数据的方法总结
前言
增删改查是我们日常开发中的最基本任务，在JavaScript中我们经常需要从数据组删除特定的数据项。然而，JavaScript数组中并没有提供删除特定数据项的方法。所以我们必须使用替代的方法，来从javaScript中删除特定数据项。
如何在Javascript中删除特定的数组项
1：使用 filter()
使用现代 Javascript 删除特定数组项的最简单方法是使用过滤器。让我们看一个简单的例子：
let myArr = [ "🍎", "🍏", "🍐", "🍍" ]; let removedArr = myArr.filter((x) => x !== "🍍"); console.log(removedArr);
当我们的数组中的每一个数据想都是唯一的时候，他是正常工作的，但是当我们的存在重复项的时候，此时如果你只想删除一个，保留其他重复的，这种方式是无法做到的。
let myArr = [ "🍎", "🍏", "🍏", "🍍" ]; let removedArr = myArr.filter((x) => x !== "🍏"); console.log(removedArr);
由于我们有两个青苹果，并且新数组过滤掉了所有青苹果，因此我们在使用此方法时实际上删除了两个项目。如果我们只想删除一个元素，我们必须使用另一种方法。
2：使用 indexOf() 和 splice()
indexOf() 方法可返回某个指定的字符串值在字符串中首次出现的位置。如果没有找到匹配的字符串则返回 -1。 splice() 方法用于添加或删除数组中的元素。注意：这种方法会改变原始数组。 这种方式与上面的区别在于：
- 首先，它改变了原始数组——所以我们不在这里复制。原始数组将被改变。
- 其次，它使用两个函数——首先我们获取indexOf要删除的数组项，然后我们splice获取数组以删除单个项。
这是一个例子：
let myArr = [ "🍎", "🍏", "🍏", "🍍" ];
let getLocation = myArr.indexOf("🍏");
myArr.splice(getLocation, 1);
// myArr now becomes [ "🍎", "🍏", "🍍" ];
console.log(myArr);附：js delete方法删除指定位置的数组元素
delete方法可以通过数组的下标将js数组中的一个元素从指定位置上删除，且删除掉数组中的元素后，会把该下标出的值置为undefined，数组的长度不会变。
语法：
delete.数组[数组下标];/*数组下标控制指定位置，下标从0开始*/
代码实例：删除animal数组的第二项元素，即：animal[1]，然后animal[1]的值会为：undefined。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
</head>
<body>
<div class="demo">
<p>数组：cat，elephant，tiger，rabbit；<br>数组长度为：4</p>
<button onclick="myFunction()">点我--delete删除元素</button>
</div>
</body>
<script type="text/javascript">
function myFunction(){
var animal = ["cat", "elephant", "tiger","rabbit"];
document.write("<p>数组："+animal+"<br>数组长度："+ animal.length+"</p>");
var animal1= delete animal[1];
document.write("<p>新数组："+animal+"<br>删除元素后，现在为："+ animal[1]+"<br>数组长度："+ animal.length+"</p>");
}
</script>
</html>总结
尽管在 Javascript 中没有直接从数组中删除项目的方法，但我们确实有两个工具可以为我们提供足够的灵活性来涵盖几乎所有有关删除数组项目的场景。
到此这篇关于JavaScript从数组中删除特定数据的文章就介绍到这了,更多相关js数组删除特定数据内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！
相关文章
这篇文章主要介绍了js父页面与子页面不同时显示的方法,打开一个页面后,父页面DISABLE,在子页面关闭后,父页面ENABLE,是比较实用的技巧,需要的朋友可以参考下2014-10-10
这里向大家描述一下JS操作css的float属性的特殊写法，使用js操作css属性的写法是有一定的规律的，对于没有中划线的css属性一般直接使用style.属性名即可2007-08-08
这篇文章主要给大家介绍了关于JavaScript实现日期格式化的相关资料,JavaScript中的日期对象提供了许多方法和属性,可以通过它们来进行日期的格式化,需要的朋友可以参考下2023-09-09
这篇文章主要介绍了javascript iframe跨域详解的相关资料,需要的朋友可以参考下2016-10-10
此前发表的那一版确实能不用循环，但是总用正则表达式的替换，不一定比用循环提高性能，而且把程序搞得有些太复杂了。从《JavaScript权威指南》上学到的范例如下2009-01-01
最近工作中遇到了一些死循环导致的页面卡死问题,经过 trouble shooting 和代码修复解决了问题,所以下面这篇文章主要给大家介绍了怎么检测和防止JavaScript死循环的相关资料,需要的朋友可以参考下2021-11-11
这篇文章主要为大家介绍了JavaScript禁止页面回退的方法步骤,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪2023-08-08
这篇文章主要为大家介绍了实现jquery手风琴效果的详细代码，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2016-01-01
这篇文章主要介绍了JavaScript实现的联动菜单特效,涉及javascript事件响应及页面元素属性动态操作相关实现技巧,需要的朋友可以参考下2019-07-07
这篇文章主要介绍了 JavaScript-定时器0~9抽奖系统，通过代码实例说明函数调用的整体操作，具体步骤大家可查看下文的详细讲解，感兴趣的小伙伴们可以参考一下。2017-08-08
最新评论