您的位置:首页 > Web前端 > JQuery

jQuery的each与map的区别

2017-04-29 14:38 381 查看
1、$.map(array,function)

语法分析:为包装集中的每一个元素调用回调函数,并将返回值收集到jQuery对象的实例中,在回调函数中,this指向每次迭代中的当前DOM元素。

2、$.each(array,function)

语法分析:对数组array中的每一个元素,调用function函数处理,但没有返回值(因此不管在callback里面加不加return,效果都是一样的)。

$.each()函数可用于迭代任何集合,无论是名/值对象(JavaScript对象)或数组。

(1)遍历数组(有附件参数)

$.each(Array, function(p1, p2){

    this;    //这里的this指向每次遍历中Array的当前元素

    p1; p2;  //访问附加参数

}, ['参数1', '参数2']);

(2)遍历对象(没有附加参数)

$.each(Object, function(name, value) {

    this;    //this指向当前属性的值

    name;    //name表示Object当前属性的名称

    value;   //value表示Object当前属性的值

});

两者的区别:

map()方法主要用来遍历操作数组和对象,each()主要用于遍历jquery对象。

each()返回的是原来的数组,并不会新创建一个数组。

map()方法会返回一个新的数组。如果在没有必要的情况下使用map,则有可能造成内存浪费。

 

测试例子:

总结:当遍历数组的时候,each因为没有返回值,所以用不用return都不会改变其值,map因为是创建一个新的数组,所以对原来的数组也不会造成影响。

当遍历对象的时候,each遍历时候如果改动了参数值(不管return有木有加),原来的对象即被改变了,而map遍历的时候改动了参数值(必须加return,否则返回[]),遍历创建的新的对象和原来的对象均被改变了。

var obj1 = [10,20];
$.each(obj1,function(i,param){
return param+1;
});
//[10, 20]
//obj1:[10,20]

var obj2 = [10,20];
$.each(obj2,function(i,param){
return [param+1];
});
//[10, 20]
//obj2:[10,20]

var obj3 = [10,20];
$.each(obj3,function(i,param){
return [[param+1]];
});
//[10, 20]
//obj3:[10,20]

var obj4 = [10,20];
$.map(obj4,function(param){
return param+1;
});
//[11, 21]
//obj4:[10,20]

var obj5 = [10,20];
$.map(obj5,function(param){
return [param+1];
});
//[11, 21]
//obj5:[10,20]

var obj6 = [10,20];
$.map(obj6,function(param){
return [[param+1]];
});
//[[11],[21]]
//obj6:[10,20]

var obj7 = {
1:{id:'001'},
2:{id:'002'}
};
$.each(obj7,function(i,param){
return (param.id += 1);
});
//{1:{id:'0011'},2:{id:'0021'}};
//obj7:{1:{id:'0011'},2:{id:'0021'}}

var obj7 = {
1:{id:'001'},
2:{id:'002'}
};
$.each(obj7,function(i,param){
(param.id += 1);
});
//{1:{id:'0011'},2:{id:'0021'}};
//obj7:{1:{id:'0011'},2:{id:'0021'}}

var obj8 = {
1:{id:'001'},
2:{id:'002'}
};
$.
b62b
map(obj8,function(param){
return param.id += 1;
});
//["0011", "0021"]
//obj8:{1:{id:'0011'},2:{id:'0021'}}

var obj8 = {
1:{id:'001'},
2:{id:'002'}
};
$.map(obj8,function(param){
param.id += 1;
});
//[]
//obj8的值:{1:{id:'0011'},2:{id:'0021'}}

var obj9 = {
1:{id:'001'},
2:{id:'002'}
};
$.each(obj9,function(i,param){
return [[param.id += 1]];
});
//{1:{id:'0011'},2:{id:'0021'}}
//obj9:{1:{id:'0011'},2:{id:'0021'}}

var obj10 = {
1:{id:'001'},
2:{id:'002'}
};
$.map(obj10,function(param){
return [[param.id += 1]];
});
// [["0011"],["0021"]]
//obj10的值: {1:{id:'0011'},2:{id:'0021'}}

转载的链接:http://blog.csdn.net/liaozhongping/article/details/53502974
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: