原生的map与jQuery的map。
1.原生的map:不能遍历伪数组。
2.jQuery的map:可以遍历伪数组。
jQuery的map与each。
1.map:map返回的是一个空数组,并且支持在回调函数中对遍历的数组进行处理。
2.each:each是遍历谁就返回谁,并且不支持在回调函数中对遍历的数组进行处理。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>10-静态方法map方法</title>
<script src="JS_file/jquery-1.12.4.js"></script>
<script>
var arry=[1,3,5,7,9] //数组
var obj={0:1,1:3,2:5,3:7,4:9,length:5};//伪数组
//1.利用原生JS的map方法遍历
/*
* 第一个参数:当前遍历到的元素
*第二个参数:当前遍历到的索引
* 第三个参数:当前遍历到的数组
* 注意点:
* 和原生的forEach一样,不能遍历伪数组
* */
// arry.map(function (value, index, array) {
// console.log(index,value,array);
// });
// obj.map(function (value,index,array) {// 报错obj.map is not a function
// console.log(index,value,array);
// })
/*
* 第一个参数:要遍历的数组
* 第二个参数:每遍历一个元素之后执行的回调函数
* 回调函数的参数:
* 第一个参数:遍历到的元素
*第二个参数:遍历到的索引
* 注意点:
* 和jQuery的each静态方法一样,map静态方法也可以遍历伪数组
* */
// $.map(arry,function (value,index) {
// console.log(index,value)
// });
/*
* jQuery的each静态方法和map静态方法的区别:
*each静态方法默认返回值是,遍历谁就返回谁
*map静态方法的默认返回值是,一个空数组
* */
var res1= $.map(obj,function (value,index) {
console.log(index,value);
})
var res2= $.each(obj,function (index,value) {
console.log(index,value);
})
console.log(res1); //是一个空数组
console.log(res2); //返回的是obj
/*
*each静态方法不支持在回调函数中对遍历的数组进行处理
* map静态方法可以在回调函数中通过return 对遍历的数组进行处理,然后生产一个新的数组返回
*/
var res3= $.map(obj,function (value,index) {
console.log(index,value);
return value+index;
})
var res4= $.each(obj,function (index,value) {
console.log(index,value);
return index+value
})
console.log(res3); //有返回值,返回值是一个数组
console.log(res4); //无返回值
</script>
</head>
<body>
</body>
</html>
总结:1.静态方法map方法和each方法一样,JS原生无法遍历伪数组,jQuery可以遍历伪数组
那么map与each又有什么区别呢?
区别一:.静态方法each是遍历谁,就返回谁;静态方法map方法返回,一个空数组
区别二:静态方法map可以在回调函数中通过return对遍历的数组进行处理,然后产生一个新的数组返回;
静态方法each不支持在回调函数中对遍历数组进行处理