博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
jquery 多种遍历数组方法
阅读量:6041 次
发布时间:2019-06-20

本文共 3605 字,大约阅读时间需要 12 分钟。


grep

<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
);
        }
        for (key in filterarray){
            alert(filterarray[key]);
        }
    }
);
</script>
 
each
<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
<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
<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){
        alert(key+':'+json[key]);
    }
}
</script>
遍历json对象
有如下 json对象:
var obj ={”name”:”冯娟”,”password”:”123456″,”department”:”技术部”,”sex”:” 女”,”old”:30};
遍历方法:
for(var p in obj){
    str = str+obj[p]+’,';
    return str;
}
几种遍历方案...
这里来使用each方法来遍历json对象的数据代码
varcomments=[{
"username":"张三","content":"沙发."},{
"username":"李四","content":"板凳."},{
"username":"王五","content":"地板."}];
varhtml='';$.each( comments ,function(commentIndex, comment) {
html+='<div class="comment"><h6>'+comment['username']+':</h6><p class="para">'+comment['content']+'</p></div>';})
$('#resText').html(html);说明: each在每次执行函数时,都会给函数传递一个表示作为执行环境的元素在匹配的元素集合中所处位置的数字值作为参数。这里所指的
则为commentIndex, 而每一个commentIndex所对应的值则为comment, comment则为其中一个json对象,即如{
"username":"张三","content":"沙发."}
  each函数是基本上所有的框架都提供了的一个工具类函数,通过它,你可以遍历对象、数组的属性值并进行处理。
    jQuery和jQuery对象都实现了该方法,对于jQuery对象,只是把each方法简单的进行了委托:把jQuery对象作为第一个参数传递给 jQuery的each方法.换句话说:jQuery提供的each方法是对参数一提供的对象的中所有的子元素逐一进行方法调用。而jQuery对象提供 的each方法则是对jQuery内部的子元素进行逐个调用。    jQuery.prototype.each=function( fn, args ) {       return jQuery.each( this, fn, args );    }
   让我们看一下jQuery提供的each方法的具体实现,     jQuery.each(obj,fn,arg)       该方法有三个参数:进行操作的对象obj,进行操作的函数fn,函数的参数args。     让我们根据ojb对象进行讨论:
1.obj对象是数组 each方法会对数组中子元素的逐个进行fn函数调用,直至调用某个子元素返回的结果为false为止,也就是说,我们可以在提供的fn函数进行处理,使 之满足一定条件后就退出each方法调用。当each方法提供了arg参数时,fn函数调用传入的参数为arg,否则为:子元素索引,子元素本身 2.obj 对象不是数组 该方法同1的最大区别是:fn方法会被逐次不考虑返回值的进行进行。换句话说,obj对象的所有属性都会被fn方法进行调用,即使fn函数返回false。调用传入的参数同1类似。 jQuery.each=function( obj, fn, args ) {     if ( args ) {        if ( obj.length == undefined ){            for ( var i in obj )              fn.apply( obj, args );        }else{            for ( var i = 0, ol = obj.length; i < ol; i++ ) {
              if ( fn.apply( obj, args ) === false )                   break; 
          }
       }   } else {        if ( obj.length == undefined ) {
            for ( var i in obj )                fn.call( obj, i, obj );        }else{           for ( var i = 0, ol = obj.length, val = obj[0]; i < ol && fn.call(val,i,val) !== false; val = obj[++i] ){} 
       }  }   return obj; }   需要特别注意的是each方法中fn的具体调用方法并不是采用简单的fn(i,val)或fn(args),而是采用了 fn.call(val,i,val)或fn.apply(obj.args)的形式,这意味着,在你自己的fn的实现中,可以直接采用this指针引用 数组或是对象的子元素。这种方式是绝大多数jQuery所采用的一种实现方式。

   本文转自My_King1 51CTO博客,原文链接:http://blog.51cto.com/apprentice/1360583,如需转载请自行联系原作者

你可能感兴趣的文章
java.exe进程来源排查录
查看>>
点滴记录——Ubuntu 14.04中Solr与Tomcat整合安装
查看>>
C++实现KMP模式匹配算法
查看>>
ubuntu linux下建立stm32开发环境: GCC安装以及工程Makefile建立
查看>>
记录锁
查看>>
JSONObject与JSONArray的使用
查看>>
[SQL Server] 数据库日志文件自动增长导致连接超时的分析
查看>>
【常见Web应用安全问题】---6、Script source code disclosure
查看>>
<html:form>标签
查看>>
除了《一无所有》,我一无所有
查看>>
每日英语:China Seeks to Calm Anxiety Over Rice
查看>>
C++中struct和class的区别 [转]
查看>>
C++ ofstream和ifstream详细用法
查看>>
Mysql 连接查询 Mysql支持的连接查询有哪些
查看>>
Hive Streaming 追加 ORC 文件
查看>>
打开Apache自带的Web监视器
查看>>
eclipse插件
查看>>
Android笔记:通过RadioGroup/RadioButton自定义tabhost的简单方法
查看>>
ELCSlider
查看>>
XCode工程中 Targets详解
查看>>