jquery遍历数组与筛选数组的方法


Posted in Javascript onNovember 05, 2013

grep
grep()方法用于数组元素过滤筛选
grep(array,callback,invert)
array:待过滤数组;
callback:处理数组中的每个元素,并过滤元素,该函数中包含两个参数,第一个是当前数组元素的值,一个是当前数组元素的下标,即元素索引值。此函数应返回一个布尔值。另外,此函数可设置为一个字符串,当设置为字符串时,将视为“lambda-form”(缩写形式?),其中 a 代表数组元素,i 代表元素索引值。如“a > 0”代表“function(a){ return a > 0; }”
invert:布尔型可选项,默认值false,值为true或false, 如果 “invert” 为 false 或为设置,则函数返回数组中由过滤函数返回 true 的元素,当”invert” 为 true,则返回过滤函数中返回 false 的元素集
 

<script type='text/javascript' src="/jquery.js"></script>
<script type="text/javascript">
$().ready(
    function(){
        var array = [1,2,3,4,5,6,7,8,9];
        var filterarray = $.grep(array,function(value){
            return value > 5;//筛选出大于5的
        });
        for(var i=0;i<filterarray.length;i++){
            alert(filterarray[i]);
        }
        for (key in filterarray){
            alert(filterarray[key]);
        }
    }
);
</script>
 

each
each的使用方法
在jQuery里有一个each方法,用起来非常的爽,不用再像原来那样写for循环,jQuery源码里自己也有很多用到each方法。
其实jQuery里的each方法是通过js里的call方法来实现的。

<script type='text/javascript' src="/jquery.js"></script>
<script type="text/javascript">
$().ready(
    function(){
        var anObject = {one:1,two:2,three:3};//对json数组each
        $.each(anObject,function(name,value) {
            alert(name);
            alert(value);
        });
        var anArray = ['one','two','three'];
        $.each(anArray,function(n,value){
            alert(n);
            alert(value);
        }
        );
    }
);
</script>

inArray
jQuery.isArray(obj) 是 jQuery 1.3 新增。测试对象是否为数组。  返回值:Boolean
参数 : objObject用于测试是否为数组的对象
示例 :检测是否为数组

<script type='text/javascript' src="/jquery.js"></script>
<script type="text/javascript">
$().ready(
    function(){
        var anArray = ['one','two','three'];
        var index = $.inArray('two',anArray);
        alert(index);//返回该值在数组中的键值,返回1
        alert(anArray[index]);//value is two
    }
);
</script>

map
map() 把每个元素通过函数传递到当前匹配集合中,生成包含返回值的新的 jQuery 对象。
由于返回值是 jQuery 封装的数组,使用 get() 来处理返回的对象以得到基础的数组。
.map() 方法对于获得或设置元素集的值特别有用。请思考下面这个带有一系列复选框的表单

<script type='text/javascript' src="/jquery.js"></script>
<script type="text/javascript">
$().ready(
    function(){
        var strings = ['0','1','2','3','4','S','6'];
        var values = $.map(strings,function(value){
                var result = new Number(value);
                return isNaN(result) ? null:result;//isNaN:is Not a Number的缩写
            }
        );
        for (key in values) {
            alert(values[key]);
        }
    }
);
</script>

遍历json对象:

<script>
var json = [{dd:'SB',AA:'东东',re1:123},{cccc:'dd',lk:'1qw'}];
for(var i=0,l=json.length;i<l;i++){
    for(var key in json[i]){
        alert(key+':'+json[i][key]);
    }
}
</script>

遍历json对象
有如下 json对象:

var obj ={”name”:”冯娟”,”password”:”123456″,”department”:”技术部”,”sex”:” 女”,”old”:30};
遍历方法:
for(var p in obj){
    str = str+obj[p]+',';
    return str;
}
Javascript 相关文章推荐
jQuery插件原来如此简单 jQuery插件的机制及实战
Feb 07 Javascript
Package.js  现代化的JavaScript项目make工具
May 23 Javascript
jQuery.Highcharts.js绘制柱状图饼状图曲线图
Mar 14 Javascript
javascript数组随机排序实例分析
Jul 22 Javascript
JavaScript 函数模式详解及示例
Sep 07 Javascript
bootstrap选项卡使用方法解析
Jan 11 Javascript
jQuery基于ajax方式实现用户名存在性检查功能示例
Feb 10 Javascript
BootStrapValidator初使用教程详解
Feb 10 Javascript
AngularJS学习第一篇 AngularJS基础知识
Feb 13 Javascript
AngularJS中ng-options实现下拉列表的数据绑定方法
Aug 13 Javascript
JavaScript实现轮播图片完整代码
Mar 07 Javascript
Vue 按照创建时间和当前时间显示操作(刚刚,几小时前,几天前)
Sep 10 Javascript
javascript alert乱码的解决方法
Nov 05 #Javascript
jquery三个关闭弹出层的小示例
Nov 05 #Javascript
jquery ajax post提交数据乱码
Nov 05 #Javascript
jquery ajax属性async(同步异步)示例
Nov 05 #Javascript
jQuery Ajax异步处理Json数据详解
Nov 05 #Javascript
Javascript脚本实现静态网页加密实例代码
Nov 05 #Javascript
客户端js性能优化小技巧整理
Nov 05 #Javascript
You might like
PHP Directory 函数的详解
2013/03/07 PHP
thinkphp5框架调用其它控制器方法 实现自定义跳转界面功能示例
2019/07/03 PHP
laravel 数据验证规则详解
2019/10/23 PHP
js继承的实现代码
2010/08/05 Javascript
javascript天然的迭代器
2010/10/29 Javascript
如何确保JavaScript的执行顺序 之jQuery.html深度分析
2011/03/03 Javascript
(跨浏览器基础事件/浏览器检测/判断浏览器)经验代码分享
2013/01/24 Javascript
jquery重复提交请求的原因浅析
2014/05/23 Javascript
node.js中的buffer.fill方法使用说明
2014/12/14 Javascript
基于Jquery和CSS3制作数字时钟附源码下载(CSS3篇)
2015/11/24 Javascript
Bootstrap table使用方法详细介绍
2016/12/09 Javascript
使用AngularJS2中的指令实现按钮的切换效果
2017/03/27 Javascript
浅谈Vue 数据响应式原理
2018/05/07 Javascript
JS/HTML5游戏常用算法之碰撞检测 地图格子算法实例详解
2018/12/12 Javascript
微信小程序中限制激励式视频广告位显示次数(实现思路)
2019/12/06 Javascript
vue中如何自定义右键菜单详解
2020/12/08 Vue.js
使用python 获取进程pid号的方法
2014/03/10 Python
安装Python的教程-Windows
2017/07/22 Python
Python3 适合初学者学习的银行账户登录系统实例
2017/08/08 Python
今天 平安夜 Python 送你一顶圣诞帽 @微信官方
2017/12/25 Python
用Python实现BP神经网络(附代码)
2019/07/10 Python
Python中的上下文管理器相关知识详解
2019/09/19 Python
Python字典中的值为列表或字典的构造实例
2019/12/16 Python
Python如何实现远程方法调用
2020/08/07 Python
python 多线程爬取壁纸网站的示例
2021/02/20 Python
什么是CSS3 HSLA色彩模式?HSLA模拟渐变色条
2016/04/26 HTML / CSS
浅谈HTML5新增和废弃的标签
2019/04/28 HTML / CSS
Java中会存在内存泄漏吗,请简单描述
2016/12/22 面试题
销售部主管岗位职责
2013/12/18 职场文书
迟到检讨书500字
2014/02/05 职场文书
学习十八届四中全会依法治国心得体会
2014/11/03 职场文书
经销商会议开幕词
2016/03/04 职场文书
创业计划书之旅游网站
2019/09/06 职场文书
《文化苦旅》读后感:阅读,让人诗意地栖居在大地上
2019/12/24 职场文书
MySQL索引失效的典型案例
2021/06/05 MySQL
Java实现多线程聊天室
2021/06/26 Java/Android