利用jQuery操作对象数组的实现代码


Posted in Javascript onApril 27, 2011

jQuery对于数组元素操作主要提供了以下工具:
(1)数组和对象的例遍:jQuery.each(obj,callback)
通用例遍方法,可用于例遍对象和数组。回调函数拥有两个参数:第一个为对象的成员或数组的索引,第二个为对应变量或内容。如果需要退出 each 循环可使回调函数返回 false,其它返回值将被忽略。
(2)数组元素的过滤:jQuery.grep(array,callback,[invert])
使用过滤函数过滤数组元素。此函数至少传递两个参数:待过滤数组和过滤函数。过滤函数必须返回 true 以保留元素或 false 以删除元素。
(3)数组元素的查找:jQuery.inArray(value,array)
确定第一个参数在数组中的位置(如果没有找到则返回 -1 )。
(4)删除重复元素:jQuery.unique(array)
删除数组中重复元素。
下面的实例通过对象数组的过滤来实现获取或者删除指定属性为指定值的数组元素。

<script src="js/jquery.js" ></script> 
<script> 
/** 
* 从对象数组中删除属性为objPropery,值为objValue元素的对象 
* @param Array arrPerson 数组对象 
* @param String objPropery 对象的属性 
* @param String objPropery 对象的值 
* @return Array 过滤后数组 
*/ 
function remove(arrPerson,objPropery,objValue) 
{ 
return $.grep(arrPerson, function(cur,i){ 
return cur[objPropery]!=objValue; 
}); 
} 
/** 
* 从对象数组中获取属性为objPropery,值为objValue元素的对象 
* @param Array arrPerson 数组对象 
* @param String objPropery 对象的属性 
* @param String objPropery 对象的值 
* @return Array 过滤后的数组 
*/ 
function get(arrPerson,objPropery,objValue) 
{ 
return $.grep(arrPerson, function(cur,i){ 
return cur[objPropery]==objValue; 
}); 
} 
/** 
* 显示对象数组信息 
* @param String info 提示信息 
* @param Array arrPerson 对象数组 
*/ 
function showPersonInfo(info,arrPerson) 
{ 
$.each(arrPerson, function(index,callback){ 
info+="Person id:" + arrPerson[index].id + " name:" + arrPerson[index].name+ " sex:"+ arrPerson[index].sex+" age:"+ arrPerson[index].age+"\r\t"; 
}); 
alert(info); 
} 
//测试数据 
var arrPerson=new Array(); 
var person=new Object(); 
person.id=1; 
person.name="帅哥"; 
person.sex="男"; 
person.age=30; 
arrPerson.push(person); 
person=new Object(); 
person.id=2; 
person.name="美眉甲"; 
person.sex="女"; 
person.age=28; 
arrPerson.push(person); 
person=new Object(); 
person.id=3; 
person.name="美眉乙"; 
person.sex="女"; 
person.age=20; 
arrPerson.push(person); 
//测试删除 
showPersonInfo("原始数组:\r\t",arrPerson); 
arrPerson=remove(arrPerson,"id",1); 
showPersonInfo("删除之后:\r\t",arrPerson); 
//测试获取 
arrPerson=get(arrPerson,"id",3); 
showPersonInfo("只获取ID为3的元素:\r\t",arrPerson); 
</script>
Javascript 相关文章推荐
基于jQuery的获得各种控件Value的方法
Nov 19 Javascript
通过正则格式化url查询字符串实现代码
Dec 28 Javascript
javascript强大的日期函数代码分享
Sep 04 Javascript
JavaScript作用域链示例分享
May 27 Javascript
node.js中的fs.readdirSync方法使用说明
Dec 17 Javascript
jquery单击事件和双击事件冲突解决方案
Mar 02 Javascript
利用Javascript实现BMI计算器
Aug 16 Javascript
通过原生JS实现为元素添加事件的方法
Nov 23 Javascript
tablesorter.js表格排序使用方法(支持中文排序)
Feb 10 Javascript
ES6新数据结构Set与WeakSet用法分析
Mar 31 Javascript
微信小程序实现跑马灯效果
Oct 21 Javascript
Vue实现手机号、验证码登录(60s禁用倒计时)
Dec 19 Vue.js
jquery.cookie.js 操作cookie实现记住密码功能的实现代码
Apr 27 #Javascript
jquery调用asp.net 页面后台的实现代码
Apr 27 #Javascript
jQuery Ajax方法调用 Asp.Net WebService 的详细实例代码
Apr 27 #Javascript
Javascript实现仿WebQQ界面的“浮云”兼容 IE7以上版本及FF
Apr 27 #Javascript
js,jQuery 排序的实现代码,网页标签排序的实现,标签排序
Apr 27 #Javascript
javascript中的继承实例代码
Apr 27 #Javascript
各浏览器对link标签onload/onreadystatechange事件支持的差异分析
Apr 27 #Javascript
You might like
php array_walk 对数组中的每个元素应用用户自定义函数详解
2016/11/18 PHP
js获取url参数代码实例分享(JS操作URL)
2013/12/13 Javascript
jquery预览图片实现鼠标放上去显示实际大小
2014/01/16 Javascript
JavaScript strike方法入门实例(给字符串加上删除线)
2014/10/17 Javascript
javascript实现连续赋值
2015/08/10 Javascript
使用EVAL处理jqchart jquery 折线图返回数据无效的解决办法
2015/11/26 Javascript
玩转JavaScript OOP - 类的实现详解
2016/06/08 Javascript
AngularJS入门教程之ng-checked 指令详解
2016/08/01 Javascript
js实现楼层导航功能
2017/02/23 Javascript
在node.js中怎么屏蔽掉favicon.ico的请求
2017/03/01 Javascript
vue2中filter()的实现代码
2017/07/09 Javascript
详解Vue2中组件间通信的解决全方案
2017/07/28 Javascript
vue-cli中的babel配置文件.babelrc实例详解
2018/02/22 Javascript
详解vue2.0 资源文件assets和static的区别
2018/11/27 Javascript
js实现表格数据搜索
2020/08/09 Javascript
javascript自定义加载loading效果
2020/09/15 Javascript
vue+element table表格实现动态列筛选的示例代码
2021/01/14 Vue.js
python实现mysql的单引号字符串过滤方法
2015/11/14 Python
浅析Python中else语句块的使用技巧
2016/06/16 Python
深入理解Django中内置的用户认证
2017/10/06 Python
在python中使用正则表达式查找可嵌套字符串组
2017/10/24 Python
python如何制作英文字典
2019/06/25 Python
python画图把时间作为横坐标的方法
2019/07/07 Python
Python3将ipa包中的文件按大小排序
2020/04/17 Python
浅析PyCharm 的初始设置(知道)
2020/10/12 Python
Python中BeautifulSoup通过查找Id获取元素信息
2020/12/07 Python
HTML5 Canvas如何实现纹理填充与描边(Fill And Stroke)
2013/07/15 HTML / CSS
台湾最大银发乐活百货:乐龄网
2018/05/21 全球购物
女子锻炼服装和瑜伽服装:Splits59
2019/03/04 全球购物
捐款倡议书格式范文
2014/05/14 职场文书
超市开业庆典策划方案
2014/05/14 职场文书
综治工作汇报材料
2014/10/27 职场文书
2015国庆节感想
2015/08/04 职场文书
详解Js模块化的作用原理和方案
2021/04/29 Javascript
教你使用pyinstaller打包Python教程
2021/05/27 Python
mysql中int(3)和int(10)的数值范围是否相同
2021/10/16 MySQL