浅析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 相关文章推荐
jquery load()在firefox(火狐)下显示不正常的解决方法
Apr 05 Javascript
js浮点数精确计算(加、减、乘、除)
Dec 26 Javascript
js实现左侧网页tab滑动门效果代码
Sep 06 Javascript
JavaScript进阶练习及简单实例分析
Jun 03 Javascript
微信小程序 JS动态修改样式的实现方法
Dec 16 Javascript
JS数组扁平化(flat)方法总结详解
Jun 24 Javascript
移动端手指操控左右滑动的菜单
Sep 08 Javascript
layui 富文本图片上传接口与普通按钮 文件上传接口的例子
Sep 23 Javascript
vue下的@change事件的实现
Oct 25 Javascript
js滚轮事件 js自定义滚动条的实现
Jan 18 Javascript
js实现圆形显示鼠标单击位置
Feb 11 Javascript
AJAX XMLHttpRequest对象创建使用详解
Aug 20 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
十天学会php之第四天
2006/10/09 PHP
php自动获取字符串编码函数mb_detect_encoding
2011/05/31 PHP
ZendFramework框架实现连接两个或多个数据库的方法
2016/12/08 PHP
PHP 结合 Boostrap 结合 js 实现学生列表删除编辑及搜索功能
2019/05/21 PHP
TP3.2.3框架文件上传操作实例详解
2020/01/23 PHP
学习YUI.Ext 第六天--关于树TreePanel(Part 2异步获取节点)
2007/03/10 Javascript
jquery.lazyload  实现图片延迟加载jquery插件
2010/02/06 Javascript
javascript重写alert方法的实例代码
2013/03/29 Javascript
JavaScript实现图片轮播的方法
2015/07/31 Javascript
如何利用AngularJS打造一款简单Web应用
2015/12/05 Javascript
简述jQuery ajax的执行顺序
2016/01/05 Javascript
使用Web Uploader实现多文件上传
2016/06/08 Javascript
Bootstrap弹出框modal上层的输入框不能获得焦点问题的解决方法
2016/12/13 Javascript
利用JavaScript在网页实现八数码启发式A*算法动画效果
2017/04/16 Javascript
js-FCC算法-No repeats please字符串的全排列(详解)
2017/05/02 Javascript
js es6系列教程 - 基于new.target属性与es5改造es6的类语法
2017/09/02 Javascript
详解webpack4之splitchunksPlugin代码包分拆
2018/12/04 Javascript
详解用场景去理解函数柯里化(入门篇)
2019/04/11 Javascript
Node.js一行代码实现静态文件服务器的方法步骤
2019/05/07 Javascript
vue 重塑数组之修改数组指定index的值操作
2020/08/09 Javascript
js实现自定义滚动条的示例
2020/10/27 Javascript
修改NPM全局模式的默认安装路径的方法
2020/12/15 Javascript
python实现壁纸批量下载代码实例
2018/01/25 Python
使用python读取csv文件快速插入数据库的实例
2018/06/21 Python
python使用xlsxwriter实现有向无环图到Excel的转换
2018/12/12 Python
20行python代码的入门级小游戏的详解
2019/05/05 Python
python求numpy中array按列非零元素的平均值案例
2020/06/08 Python
英国领先的狗和宠物美容专家:Christies Direct
2017/04/03 全球购物
欧洲最大的化妆品连锁公司:Douglas道格拉斯
2017/05/06 全球购物
Java中会存在内存泄漏吗,请简单描述
2016/12/22 面试题
J2EE面试题
2016/03/14 面试题
个人思想理论学习的自我鉴定
2013/11/30 职场文书
先进党支部事迹材料
2014/01/13 职场文书
银行办公室岗位职责
2014/03/10 职场文书
南京青奥会口号
2014/06/12 职场文书
推普周活动总结
2014/08/28 职场文书