JS中map(),forEach(),each()方法总结

一.原生JS

  1. map()
    语法:array.map( callback(currentValue,index,arr),thisValue)

    callback(currentValue,index,arr):回调函数,数组中的每个元素都会执行这个函数。
    currentValue:必须。当前元素的值
    index:可选。当前元素的索引值
    arr:可选。当前元素属于的数组对象
    thisValue:可选。指定回调函数的this值。如果省略了thisValue,或者传入null,undefined,那么回调函数的this指向window。
    作用:返回一个新数组,数组中的元素为原始数组元素调用回调函数处理后的值

	var arrr = [1,2];
    var res = arrr.map(function(currentValue,index,arr){
         alert("遍历到的数组中的当前元素为"+currentValue);
         alert("遍历到的数组中当前元素的索引为"+index);
         alert("当前元素指向的索引对象为"+arr);
         return currentValue+=10;
    });
    console.log(res); 	//[11,12]
  1. forEach()
    语法:array.forEach(callback(currentValue,index,arr),thisValue)
    callback(currentValue,index,arr):回调函数,数组中的每个元素都会执行这个函数。
    currentValue:必须。当前元素的值
    index:可选。当前元素的索引值
    arr:可选。当前元素属于的数组对象
    thisValue:可选。传递给函数的值一般为“this”值。如果这个参数为空,“undefined”为传递给“this”值
    作用:调用数组的每个元素,并将元素传递给回调函数
	var arrr = [1,2];
    arrr.forEach(function(currentValue,index,arr){
        console.log(currentValue+1);
    });	
    //2,
    //3

二.jQuery

  1. map()
    语法:$.map(object/array,callback)

    object:Array/Object类型 指定的需要处理的数组或对象。
    callback:Function类型 指定的外处理函数。
    作用:$.map()函数用于使用指定函数 处理数组中的每个元素(或对象的每个属性),并将处理结果封装为新的数组返回。

	var res = $.map([1,2,3,4],function(a){
		return a+1;
	})
	console.log(res);	//[2,3,4,5]
	var res = $.map({name:"zxy",age:23},function(a){
          return a+"hello";
     })
     console.log(res);  //[zxyhello,23hello]
  1. each()
    语法:$(selector).each(callback(index,element))
    function(index,element):必需。为每个匹配元素规定运行的函数。
    index:选择器的index位置
    element:当前的元素(也可使用“this”选择器)
    作用:each()方法为每个匹配元素规定要运行的函数,返回false可用于及早停止循环
	<ul>
        <li>11111</li>
        <li>22222</li>
        <li>33333</li>
    </ul>
    <button>按钮</button>
    <script>
    	$("button").click(function(){
            $("li").each(function(){
                console.log($(this).text())
            });
        });
    </script>
    //11111
    //2222
    //3333

总结:以上四种方法容易混淆,所以使用时要注意每个函数的作用以及回调函数当中每个参数的定义

猜你喜欢

转载自blog.csdn.net/wodegegeya/article/details/88725755
今日推荐