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 相关文章推荐
图片轮换效果实现代码(点击按钮停止执行)
Apr 12 Javascript
关于JavaScript对象的动态选择及遍历对象
Mar 10 Javascript
JavaScript中的eval()函数使用介绍
Dec 31 Javascript
被遗忘的javascript的slice() 方法
Apr 20 Javascript
JQuery鼠标移到小图显示大图效果的方法
Jun 10 Javascript
JavaScript实现自动对页面上敏感词进行屏蔽的方法
Jul 27 Javascript
Node.js+Express配置入门教程详解
May 19 Javascript
jquery事件与绑定事件
Mar 16 Javascript
Vuex新手的理解与使用详解
May 31 Javascript
深入理解Vue keep-alive及实践总结
Aug 21 Javascript
extjs4图表绘制之折线图实现方法分析
Mar 06 Javascript
基于vue.js仿淘宝收货地址并设置默认地址的案例分析
Aug 20 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
改德生G88 - 加装等响度低音提升电路
2021/03/02 无线电
php中获取主机名、协议及IP地址的方法
2014/11/18 PHP
ThinkPHP中order()使用方法详解
2016/04/19 PHP
PHP 自动加载的简单实现(推荐)
2016/08/12 PHP
tp5框架内使用tp3.2分页的方法分析
2019/05/05 PHP
JS 密码强度验证(兼容IE,火狐,谷歌)
2010/03/15 Javascript
JavaScript 高效运行代码分析
2010/03/18 Javascript
jquery ajax提交表单数据的两种实现方法
2010/04/29 Javascript
node在两个div之间移动,用ztree实现
2013/03/06 Javascript
javascript判断是手机还是电脑访问网页的简单实例分享
2014/06/03 Javascript
一个JavaScript去除字符串末尾的空白实例代码
2014/09/22 Javascript
JavaScript学习笔记之Function对象
2015/01/22 Javascript
使用bootstrapValidator插件进行动态添加表单元素并校验
2016/09/28 Javascript
使用vue.js实现联动效果的示例代码
2017/01/10 Javascript
JavaScript的六种继承方式(推荐)
2017/06/26 Javascript
JavaScript中的ES6 Proxy的具体使用
2019/06/16 Javascript
解决layui 表单元素radio不显示渲染的问题
2019/09/04 Javascript
深入浅析JavaScript中的in关键字和for-in循环
2020/04/20 Javascript
node运行js获得输出的三种方式示例详解
2020/07/02 Javascript
js实现简单扫雷
2020/11/27 Javascript
JS+Canvas实现五子棋游戏
2020/08/26 Javascript
[01:23:35]Ti4主赛事胜者组 DK vs EG 1
2014/07/19 DOTA
[36:52]DOTA2真视界:基辅特锦赛总决赛
2017/05/21 DOTA
在Python中使用matplotlib模块绘制数据图的示例
2015/05/04 Python
Python安装模块的常见问题及解决方法
2018/02/05 Python
Django 实现 Websocket 广播、点对点发送消息的代码
2020/06/03 Python
使用Python将xmind脑图转成excel用例的实现代码(一)
2020/10/12 Python
关于python中导入文件到list的问题
2020/10/31 Python
基于CSS3实现的几个小loading效果
2018/09/27 HTML / CSS
加拿大约会网站:EliteSingles.ca
2018/01/12 全球购物
大学班长的职责
2014/01/27 职场文书
《得道多助,失道寡助》教学反思
2014/04/19 职场文书
安全生产知识竞赛活动总结
2014/07/07 职场文书
谢师宴答谢词
2015/01/05 职场文书
幼儿园大班教学反思
2016/03/02 职场文书
800字作文之大雪
2019/12/04 职场文书