详解js删除数组中的指定元素


Posted in Javascript onOctober 31, 2018

本篇文章将会给大家介绍两种删除数组中的指定元素的方式,分别为:

1、单独定义一个的函数,通过函数来删除指定数组元素。

2、为Array对象定义了一个removeByValue的方法,在调用方法来删除指定数组元素,调用非常简单的。

下面我们通过简单的代码示例来简单介绍这两种删除数组指定元素的方式。

1、定义单独的函数removeByValue来进行元素删除

代码示例:删除数组somearray里的"tue"元素

<!DOCTYPE html>
<html>
 <head>
  <meta charset="UTF-8">
 </head>
 
 <body>
  <div class="demo">
   <p>数组:mon, tue, wed, thur</p>
   <p class="p"></p>
 
  </div>
 
 </body>
 
 <script type="text/javascript">
  function removeByValue(arr, val) {
   for(var i = 0; i < arr.length; i++) {
    if(arr[i] == val) {
     arr.splice(i, 1);
     break;
    }
   }
  }
  var somearray = ["mon", "tue", "wed", "thur"]
  removeByValue(somearray, "tue");
  //somearray will now have "mon", "wed", "thur"
 
  document.write("<p>新数组:" + somearray + "</p>");
 </script>
 
</html>

效果图:

详解js删除数组中的指定元素

2、定义并调用数组的removeByValue方法来删除指定元素

代码示例:删除数组somearray里的"wed"元素

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
  </head>
  <body>
    <div class="demo">
      <p>数组:mon, tue, wed, thur</p>
      <p>删除指定元素"tue"后:</p>
    </div>
  </body>
  <script type="text/javascript">
    Array.prototype.removeByValue = function(val) {
      for(var i = 0; i < this.length; i++) {
        if(this[i] == val) {
          this.splice(i, 1);
          break;
        }
      }
    }
    var somearray = ["mon", "tue", "wed", "thur"]
    somearray.removeByValue("wed");
    //somearray will now have "mon", "wed", "thur"
 
    document.write("<p>新数组:" + somearray + "</p>");
  </script>
 
</html>

效果图:

详解js删除数组中的指定元素

总结:以上就是本篇文章所介绍的js删除数组指定元素的两种方式,大家可以自己动手试试,加深理解,希望能对大家的学习有所帮助。

Javascript 相关文章推荐
JS 自定义函数缺省值的设置方法
May 05 Javascript
将数字转换成大写的人民币表达式的js函数
Sep 21 Javascript
jquery带动画效果幻灯片特效代码
Aug 27 Javascript
Angular.JS中的this指向详解
May 17 Javascript
vue生成token保存在客户端localStorage中的方法
Oct 25 Javascript
几个你不知道的技巧助你写出更优雅的vue.js代码
Jun 11 Javascript
浅谈在不使用ssr的情况下解决Vue单页面SEO问题(2)
Nov 08 Javascript
全面了解JavaScript的作用域链
Apr 03 Javascript
vue-video-player 解决微信自动全屏播放问题(横竖屏导致样式错乱问题)
Feb 25 Javascript
详解Vue串联过滤器的使用场景
Apr 30 Javascript
react-router-dom 嵌套路由的实现
May 02 Javascript
Node.js中出现未捕获异常的处理方法
Jun 29 Javascript
Vue中使用方法、计算属性或观察者的方法实例详解
Oct 31 #Javascript
Vue项目History模式404问题解决方法
Oct 31 #Javascript
Vue.js中对css的操作(修改)具体方式详解
Oct 30 #Javascript
vue组件中的样式属性scoped实例详解
Oct 30 #Javascript
node上的redis调用优化示例详解
Oct 30 #Javascript
elementUI 设置input的只读或禁用的方法
Oct 30 #Javascript
Vue.js 父子组件通信的十种方式
Oct 30 #Javascript
You might like
《一拳超人》埼玉一拳下去,他们存在了800年毫无意义!
2020/03/02 日漫
如何从一个php文件向另一个地址post数据,不用表单和隐藏的变量的
2007/03/06 PHP
PHP实现Socket服务器的代码
2008/04/03 PHP
php创建sprite
2014/02/11 PHP
Laravel框架路由管理简单示例
2019/05/07 PHP
laravel框架模型中非静态方法也能静态调用的原理分析
2019/11/23 PHP
imagettftext() 失效,不起作用
2021/03/09 PHP
通过下拉框的值来确定输入框是否可以为空的代码
2011/10/18 Javascript
用js将内容复制到剪贴板兼容浏览器
2014/03/18 Javascript
使用jQuery动态加载js脚本文件的方法
2014/04/03 Javascript
JavaScript 里的类数组对象
2015/04/08 Javascript
jQuery中closest和parents的区别分析
2015/05/07 Javascript
在AngularJS中使用jQuery的zTree插件的方法
2016/04/21 Javascript
微信小程序 参数传递详解
2016/10/24 Javascript
详解Vue.js分发之作用域槽
2017/06/13 Javascript
纯js实现画一棵树的示例
2017/09/05 Javascript
p5.js 毕达哥拉斯树的实现代码
2018/03/23 Javascript
js实现旋转木马轮播图效果
2020/01/10 Javascript
vue-cli中实现响应式布局的方法
2021/03/02 Vue.js
[41:41]TFT vs Secret Supermajor小组赛C组 BO3 第一场 6.3
2018/06/04 DOTA
Python检测网站链接是否已存在
2016/04/07 Python
python控制windows剪贴板,向剪贴板中写入图片的实例
2018/05/31 Python
python多任务及返回值的处理方法
2019/01/22 Python
python将字符串转变成dict格式的实现
2019/11/18 Python
Python Pandas 转换unix时间戳方式
2019/12/07 Python
keras 特征图可视化实例(中间层)
2020/01/24 Python
Selenium结合BeautifulSoup4编写简单的python爬虫
2020/11/06 Python
如何用PyPy让你的Python代码运行得更快
2020/12/02 Python
办公室助理岗位职责
2013/12/25 职场文书
运动员口号
2014/06/09 职场文书
校园环境卫生倡议书
2015/04/29 职场文书
中秋节感想
2015/08/10 职场文书
教务处教学工作总结
2015/08/10 职场文书
初一年级组工作总结
2015/08/12 职场文书
严以律己学习心得体会
2016/01/13 职场文书
win10滚动条自动往上跑怎么办?win10滚动条自动往上跑的解决方法
2022/08/05 数码科技