浅析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 相关文章推荐
safari,opera嵌入iframe页面cookie读取问题解决方法
Jun 23 Javascript
JS获取IP、MAC和主机名的五种方法
Nov 14 Javascript
$(document).ready(function() {})不执行初始化脚本
Jun 19 Javascript
js模仿php中strtotime()与date()函数实现方法
Aug 11 Javascript
JavaScript File API实现文件上传预览
Feb 02 Javascript
js剪切板应用clipboardData实例解析
May 29 Javascript
jQuery中Find选择器用法示例
Sep 21 Javascript
基于Javascript实现文件实时加载进度的方法
Oct 12 Javascript
详细分析jsonp的原理和实现方式
Nov 20 Javascript
JS选取DOM元素常见操作方法实例分析
Dec 10 Javascript
JS实现滑动导航效果
Jan 14 Javascript
vue 授权获取微信openId操作
Nov 13 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 调试环境(IIS+PHP+MYSQL)
2007/01/10 PHP
PHP中计算字符串相似度的函数代码
2012/12/29 PHP
解决ajax+php中文乱码的方法详解
2013/06/09 PHP
Laravel关联模型中过滤结果为空的结果集(has和with区别)
2018/10/18 PHP
php+js实现的无刷新下载文件功能示例
2019/08/23 PHP
解决在Laravel 中处理OPTIONS请求的问题
2019/10/11 PHP
Avengerls vs Newbee BO3 第一场2.18
2021/03/10 DOTA
基于jquery的blockui插件显示弹出层
2011/04/14 Javascript
javascript实现yield的方法
2013/11/06 Javascript
JS实现鼠标框选效果完整实例
2016/06/20 Javascript
JavaScript学习笔记整理_关于表达式和语句
2016/09/19 Javascript
纯js代码生成可搜索选择下拉列表的实例
2018/01/11 Javascript
vuex的简单使用教程
2018/02/02 Javascript
初试vue-cli使用HBuilderx打包app的坑
2019/07/17 Javascript
Vue中实现回车键切换焦点的方法
2020/02/19 Javascript
Python实现字符串格式化输出的方法详解
2017/09/20 Python
解决Python print 输出文本显示 gbk 编码错误问题
2018/07/13 Python
Python 互换字典的键值对实例
2019/02/12 Python
解决python线程卡死的问题
2019/02/18 Python
Python3.5文件修改操作实例分析
2019/05/01 Python
Django 表单模型选择框如何使用分组
2019/05/16 Python
python计算波峰波谷值的方法(极值点)
2020/02/18 Python
解决python图像处理图像赋值后变为白色的问题
2020/06/04 Python
Python-openCV开运算实例
2020/07/05 Python
Python 如何在字符串中插入变量
2020/08/01 Python
python如何利用Mitmproxy抓包
2020/10/10 Python
使用Django的JsonResponse返回数据的实现
2021/01/15 Python
Python基于爬虫实现全网搜索并下载音乐
2021/02/14 Python
HTML5探秘:用requestAnimationFrame优化Web动画
2018/06/03 HTML / CSS
Shop Apotheke瑞士:您的健康与美容网上商店
2019/10/09 全球购物
英国计算机商店:Technextday
2019/12/28 全球购物
“四风”问题整改措施和努力方向
2014/09/20 职场文书
大学军训决心书
2015/02/05 职场文书
教务处教学工作总结
2015/08/10 职场文书
CSS3实现列表无限滚动/轮播效果
2021/06/23 HTML / CSS