js、jquery遍历数组和对象

js、jquery遍历数组和对象

2017年03月19日 15:54:01 阅读数:11279

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/u010476739/article/details/63685271

总结:

1.遍历数组

    1.1   原生js有两种方法都可以使用

            方法一:for(var i;i<arr.length;i++){},

            方法二:for(var i in arr){}

    1.2   jquery有两个函数共计四种方法都可以使用

           方法一:$.each(arr,function(i,item){}),

           方法二:$(arr).each(function(i,item){}),

           方法三:$.map(arr,function(i,item){}),

           方法四:$(arr).map(function(i,item){})

2.遍历对象 

    2.1    原生js有一种方法可以使用[for(var i in obj){}] 

    2.2    jquery有两个函数共计两种方法可以使用[$.each(obj,function(i,item){}),$.map(obj,function(i,item){})]

 

例子:


/*

jquery中的each是用来遍历数组的而map则是用来映射生成一个新数组的

each方法中的return false相当于循环中的break,return true相当于循环中的continue

map方法中的return 相当于个新数组映射成的一个元素,没有return就相当于新的数组中忽略掉了这个元素

*/

 

/*遍历数组*/

var arr=["a","b","c"];

console.log("js遍历数组1");

for(var i=0;i<arr.length;i++){

    console.log(i+"--"+arr[i]);

}

console.log("js遍历数组2");

for(var i in arr){

    console.log(i+"--"+arr[i]);

}

console.log("jquery.each遍历数组");

$.each(arr,function(i,item){

    console.log(i+"--"+item);

});

console.log("jquery.each遍历数组2");

$(arr).each(function(i,item){

    console.log(i+"--"+item);

});

console.log("jquery.map遍历数组1,注意这里回调函数中第一个参数是元素,第二个是索引");

$.map(arr,function(i,item){

    console.log(i+"--"+item);

});

console.log("jqery.map遍历数组2");

console.log($(arr).map(function(i,item){

    console.log(i+"--"+item);

}).length);

 

/*遍历对象*/

var obj={name:"xiaoming",age:20,addr:"tianminglu"};

console.log("js遍历对象")

for(var i in obj){

    console.log(i+"--"+obj[i]);

}

 

console.log("jquery.each遍历对象1");

$.each(obj,function(i,item){

    console.log(i+"--"+item);

});

console.log("jquery.each遍历对象2")

$(obj).each(function(i,item){

    console.log(i+"--"+item);

});

console.log("jquery.map遍历对象1,注意这里回调函数中第一个参数是元素,第二个是索引");

$.map(obj,function(i,item){

    console.log(i+"--"+item);

});    

console.log("jquery.map遍历对象2");

$(obj).map(function(i,item){

    console.log(i+"--"+item);

});
 

猜你喜欢

转载自blog.csdn.net/qq_34802511/article/details/82559725