详解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 相关文章推荐
zShowBox 图片放大展示jquery版 兼容性
Sep 24 Javascript
js获得鼠标的坐标值的方法
Mar 13 Javascript
jquery中通过父级查找进行定位示例
Jun 28 Javascript
JavaScript 模拟类机制及私有变量的方法及思路
Jul 10 Javascript
JQuery弹出层示例可自定义
May 19 Javascript
jQuery tip提示插件(实例分享)
Apr 28 jQuery
Bootstrap Table从零开始
Jun 30 Javascript
简单谈谈js的数据类型
Sep 25 Javascript
vue mint-ui学习笔记之picker的使用
Oct 11 Javascript
解决vue打包 npm run build-test突然不动了的问题
Nov 13 Javascript
jquery插件实现图片悬浮
Apr 16 jQuery
vue二维数组循环嵌套方式 循环数组、循环嵌套数组
Apr 24 Vue.js
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
单点登录 Ucenter示例分析
2013/10/29 PHP
用YUI做了个标签浏览效果
2007/02/20 Javascript
代码精简的可以实现元素圆角的js函数
2007/07/21 Javascript
Seajs的学习笔记
2014/03/04 Javascript
jQuery 浮动导航菜单适合购物商品类型的网站
2014/09/09 Javascript
jQuery不使用插件及swf实现无刷新文件上传
2014/12/08 Javascript
JavaScript中的getDay()方法使用详解
2015/06/09 Javascript
JS正则表达式比较常见用法
2016/01/26 Javascript
JavaScript面试题大全(推荐)
2016/09/22 Javascript
原生js实现商品放大镜效果
2017/01/12 Javascript
vue增删改查的简单操作
2017/07/15 Javascript
React 组件转 Vue 组件的命令写法
2018/02/28 Javascript
JS使用setInterval实现的简单计时器功能示例
2018/04/19 Javascript
使用Object.defineProperty如何巧妙找到修改某个变量的准确代码位置
2018/11/02 Javascript
详解auto-vue-file:一个自动创建vue组件的包
2019/04/26 Javascript
在vscode 中设置 vue模板内容的方法
2020/09/02 Javascript
JavaScript实现网页计算器功能
2020/10/29 Javascript
python3使用scrapy生成csv文件代码示例
2017/12/28 Python
python 请求服务器的实现代码(http请求和https请求)
2018/05/25 Python
python pycharm的安装及其使用
2019/10/11 Python
Python创建数字列表的示例
2019/11/28 Python
python中count函数简单用法
2020/01/05 Python
python实现实时视频流播放代码实例
2020/01/11 Python
Python字符串对齐、删除字符串不需要的内容以及格式化打印字符
2021/01/23 Python
python 基于pygame实现俄罗斯方块
2021/03/02 Python
关于CSS Tooltips(鼠标经过时显示)的效果
2013/04/10 HTML / CSS
美国韩国化妆品和护肤品购物网站:Beautytap
2018/07/29 全球购物
英国第一摩托车和摩托车越野配件商店:GhostBikes
2019/03/10 全球购物
Hello Molly美国:女性时尚在线
2019/08/26 全球购物
印尼第一大家居、生活和家具电子商务:Ruparupa
2019/11/25 全球购物
Weblogic的布署方式
2013/08/23 面试题
生产部管理制度
2014/01/31 职场文书
公司晚会策划方案
2014/05/17 职场文书
党内外群众意见范文
2015/06/02 职场文书
win10下go mod配置方式
2021/04/25 Golang
【D4DJ】美少女DJ企划 动画将于明年冬季开播第2季
2022/04/11 日漫