forEach和map和JQuery中的each區別
阿新 • • 發佈:2019-02-14
首先:forEach和map都是ES5的陣列的方法,而each是jQuery中的方法。(JQuery中他的對於一些方法,他還有對應的函式。下一篇在細寫方法和函式問題。)
/*
* forEach函式列子,以下特性總結:
* 1.不改變原陣列
* 2.forEach不返回原陣列
* 注意:他的函式裡面引數的順序
*/
var arr=[1,3,5,7,9];
//測試之後forEach只能遍歷陣列,他是陣列的一個方法
//他的函式三個引數,第一個必須為value,index,arr 是陣列本身,後兩個為可選,
//forEach本身有兩個引數,第一個就是處理的函式,第二個是上下文,一般預設為全域性,為undefined
var time=new Date();
console.log(time);
var a=arr.forEach(function(value,index,arr){
value+=2;
console.log("["+index+"]:"+value+" "+arr);
},)
console.log(new Date()-time);
//forEach不返回東西,所以返回為undefined
console.log(a);
//不改變原來陣列,在執行完函式之後,返回原陣列
console.log(arr);
下面為執行結果:
2018-05-26T08:11:29.481Z
[0] :3 1,3,5,7,9
[1]:5 1,3,5,7,9
[2]:7 1,3,5,7,9
[3]:9 1,3,5,7,9
[4]:11 1,3,5,7,9
5
undefined
[ 1, 3, 5, 7, 9 ]
再看一下map函式
/*
* map方法(和forrEach方法很像)
* 1.不改變原陣列
* 2.map不返回原陣列
* 注意:他的函式裡面引數的順序
* 他兩都是Es5裡面的方法
* 然後測試了一下,map方法和forEach方法的效率,從時間上來說,map更快
*/
var ccc=new Date();
var b=arr.map(function(value,index){
value*= 2;
console.log(value+" "+index);
})
console.log(new Date()-ccc);
//不返回陣列,[ undefined, undefined, undefined, undefined, undefined ]
console.log(b);
//不改變陣列
console.log(arr);
下面為執行結果:
2 0
6 1
10 2
14 3
18 4
1
[ undefined, undefined, undefined, undefined, undefined ]
[ 1, 3, 5, 7, 9 ]
再說一下jQuery中的each方法:
/*
* each
* 1.返回值為陣列本身
* 2.不改變陣列本身
* 3.他回撥函式裡面和forEach不一樣
*
*/
var arr=[1,4,2,5];
var a=$.each(arr,function(index,value){
value*=2;
console.log(index+" "+value);
});
//返回值為陣列本身
console.log(arr);
//不改變原陣列
console.log(a);
執行結果為:
0 2
1 8
2 4
3 10
>Array(4)
0:1
1:4
2:2
3:5
>Array(4)
0:1
1:4
2:2
3:5
所以。。差不多這麼多,還有的話再補充。