es5 foreach 和 map
阿新 • • 發佈:2019-02-07
一、原生JS forEach()和map()遍歷
共同點:
1.都是迴圈遍歷陣列中的每一項。
2.forEach() 和 map() 裡面每一次執行匿名函式都支援3個引數:陣列中的當前項item,當前項的索引index,原始陣列input。
3.匿名函式中的this都是指Window。
4.只能遍歷陣列。
1.forEach()
沒有返回值。
arr[].forEach(function(value,index,array){
//do something
})
- 引數:value陣列中的當前項, index當前項的索引, array原始陣列;
- 陣列中有幾項,那麼傳遞進去的匿名回撥函式就需要執行幾次;
- 理論上這個方法是沒有返回值的,僅僅是遍歷陣列中的每一項,不對原來陣列進行修改;但是可以自己通過陣列的索引來修改原來的陣列;
- var ary = [12,23,24,42,1];
- var res = ary.forEach(function (item,index,input) {
- input[index] = item*10;
- })
- console.log(res);//--> undefined;
- console.log(ary);//--> 通過陣列索引改變了原陣列;
2.map()
有返回值,可以return 出來。
arr[].map(function(value,index,array){
//do something
return XXX
})
- 引數:value陣列中的當前項,index當前項的索引,array原始陣列;
- 區別:map的回撥函式中支援return返回值;return的是啥,相當於把陣列中的這一項變為啥(並不影響原來的陣列,只是相當於把原陣列克隆一份,把克隆的這一份的陣列中的對應項改變了);
- var ary = [12,23,24,42,1];
- var res = ary.map(function (item,index,input) {
- return item*10;
- })
- console.log(res);//-->[120,230,240,420,10]; 原陣列拷貝了一份,並進行了修改
- console.log(ary);//-->[12,23,24,42,1]; 原陣列並未發生變化