浅析jquery数组删除指定元素的方法:grep()


Posted in Javascript onMay 19, 2016

遇到的问题

今天遇到一个问题,删除数组中的一个指定元素,并返回新的数组。

我定义的js数组是这样的:

var sexList=new Array[3];
sexList[0]="1";
sexList[1]="2";
sexList[2]="";

想达到的效果

我想达到的效果是这样的:

删除索引=1的元素,并返回新数组。

返回的结果是:

var sexList=new Array("1","");

我们知道,原生的javascript有一个函数:splice() 方法,可以删除数组中的指定元素。

关于splice()方法的具体用法,可以参考w3school的描述,这里不多做解释:http://www.w3school.com.cn/jsref/jsref_splice.asp

使用splice()的实现代码

我的实现代码:

var sexList=new Array[3];
sexList[0]="1";
sexList[1]="2";
sexList[2]="";
sexList=sexList.splice(1,1);

但是我发现我的数组使用这种方式时,返回的数组是不符合预期的。返回的是个空字符串。

后来网上搜索jquery的相关API,发现一个函数:grep()

grep()使用方法说明

jQuery.grep(array, callback, [invert])

概述

使用过滤函数过滤数组元素。

此函数至少传递两个参数:待过滤数组和过滤函数。过滤函数必须返回 true 以保留元素或 false 以删除元素。

参数

英文名 参数中文说明
array: 待过滤数组。
callback: 此函数将处理数组每个元素。第一个参数为当前元素,第二个参数而元素索引值。此函数应返回一个布尔值。另外,此函数可设置为一个字符串,当设置为字符串时,将视为“lambda-form”(缩写形式?),其中 a 代表数组元素,i 代表元素索引值。如“a > 0”代表“function(a){ return a > 0; }”。
invert: 如果 "invert" 为 false 或为设置,则函数返回数组中由过滤函数返回 true 的元素,当"invert" 为 true,则返回过滤函数中返回 false 的元素集。

使用grep()的实现代码

sexList=$.grep(sexList,function(n,i){
return i!=1;
});

function(n,i)中

n:表示数组的单个实体,

i:表示数组的索引。

以上这篇浅析jquery数组删除指定元素的方法:grep()就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
Javascript 不能释放内存.
Sep 07 Javascript
JavaScript Title、alt提示(Tips)实现源码解读
Dec 12 Javascript
jQuery 1.5最新版本的改进细节分析
Jan 19 Javascript
用Javascript来生成ftp脚本的小例子
Jul 03 Javascript
js控制input框只读实现示例
Jan 20 Javascript
JQuery以JSON方式提交数据到服务端示例代码
May 05 Javascript
JavaScript的jQuery库中ready方法的学习教程
Aug 14 Javascript
React利用插件和不用插件实现双向绑定的方法详解
Jul 03 Javascript
详解React 在服务端渲染的实现
Nov 16 Javascript
详解Webpack抽离第三方类库以及common解决方案
Mar 30 Javascript
微信小程序实现星星评分效果
Nov 01 Javascript
Moment的feature导致线上bug解决分析
Sep 23 Javascript
基于jQuery的Web上传插件Uploadify使用示例
May 19 #Javascript
JavaScript中的数组遍历forEach()与map()方法以及兼容写法介绍
May 19 #Javascript
当jquery ajax遇上401请求的解决方法
May 19 #Javascript
基于Echarts 3.19 制作常用的图形(非静态)
May 19 #Javascript
前端js文件合并的三种方式推荐
May 19 #Javascript
Node.js+Express配置入门教程
May 19 #Javascript
JavaScript中解决多浏览器兼容性23个问题的快速解决方法
May 19 #Javascript
You might like
人尽可用的Windows技巧小贴士之下篇
2007/03/22 PHP
php magic_quotes_gpc的一点认识与分析
2008/08/18 PHP
PHP防止post重复提交数据的简单例子
2014/06/07 PHP
教你如何在CI框架中使用 .htaccess 隐藏url中index.php
2014/06/09 PHP
推荐一本PHP程序猿都应该拜读的书
2014/12/31 PHP
php实现的递归提成方案实例
2015/11/14 PHP
laravel框架之数据库查出来的对象实现转化为数组
2019/10/23 PHP
js获取提交的字符串的字节数
2009/02/09 Javascript
jQuery点缩略图弹出层显示大图片
2015/02/13 Javascript
JavaScript获取当前网页标题(title)的方法
2015/04/03 Javascript
JavaScript中指定函数名称的相关方法
2015/06/04 Javascript
jQuery插件EnPlaceholder实现输入框提示文字
2015/06/05 Javascript
jquery实现两个图片渐变切换效果的方法
2015/06/25 Javascript
基于RequireJS和JQuery的模块化编程日常问题解析
2016/04/14 Javascript
第九章之路径分页标签与徽章组件
2016/04/25 Javascript
微信公众号支付H5调用支付解析
2016/11/04 Javascript
angular仿支付宝密码框输入效果
2017/03/25 Javascript
详解webpack 配合babel 将es6转成es5 超简单实例
2017/05/02 Javascript
一篇文章让你彻底弄懂JS的事件冒泡和事件捕获
2017/08/14 Javascript
jQuery EasyUI 折叠面板accordion的使用实例(分享)
2017/12/25 jQuery
简单实现python聊天程序
2018/04/01 Python
Python使用matplotlib和pandas实现的画图操作【经典示例】
2018/06/13 Python
Python实现从SQL型数据库读写dataframe型数据的方法【基于pandas】
2019/03/18 Python
对python3中的RE(正则表达式)-详细总结
2019/07/23 Python
创建Shapefile文件并写入数据的例子
2019/11/26 Python
Python:二维列表下标互换方式(矩阵转置)
2019/12/02 Python
浅谈keras中的Merge层(实现层的相加、相减、相乘实例)
2020/05/23 Python
Python HTMLTestRunner测试报告view按钮失效解决方案
2020/05/25 Python
H5 canvas中width、height和style的宽高区别详解
2018/11/02 HTML / CSS
Nordgreen手表德国官方网站:丹麦极简主义手表
2019/10/31 全球购物
ASP.NET中的身份验证有那些
2012/07/13 面试题
Java Servlet API中forward() 与redirect()的区别
2014/04/20 面试题
学生会离职感言
2014/02/11 职场文书
爱祖国演讲稿
2014/05/04 职场文书
Python的flask接收前台的ajax的post数据和get数据的方法
2021/04/12 Python
Ruby序列化和持久化存储 Marshal和Pstore介绍
2022/04/18 Ruby