JS中的forEach、$.each、map方法推薦
forEach是ECMA5中Array新方法中最基本的一個(gè)，就是遍歷，循環(huán)。例如下面這個(gè)例子：
[1, 2 ,3, 4].forEach(alert);
等同于下面這個(gè)for循環(huán)
var array = [1, 2, 3, 4];
for (var k = 0, length = array.length; k < length; k++) {
alert(array[k]);
}
Array在ES5新增的方法中，參數(shù)都是function類型，默認(rèn)有傳參，forEach方法中的function回調(diào)支持3個(gè)參數(shù)，第1個(gè)是遍歷的數(shù)組內(nèi)容；第2個(gè)是對(duì)應(yīng)的數(shù)組索引，第3個(gè)是數(shù)組本身。
因此，我們有：
[].forEach(function(value, index, array) {
// ...
});
對(duì)比jQuery中的$.each方法：
$.each([], function(index, value, array) {
// ...
});
會(huì)發(fā)現(xiàn)，第1個(gè)和第2個(gè)參數(shù)正好是相反的，大家要注意了，不要記錯(cuò)了。后面類似的方法，例如$.map也是如此。
var data=[1,3,4] ;
var sum=0 ;
data.forEach(function(val,index,arr){
console.log(arr[index]==val); // ==> true
sum+=val
})
console.log(sum); // ==> 8
map
這里的map不是“地圖”的意思，而是指“映射”。[].map(); 基本用法跟forEach方法類似：
array.map(callback,[ thisObject]);
callback的參數(shù)也類似：
[].map(function(value, index, array) {
// ...
});
map方法的作用不難理解，“映射”嘛，也就是原數(shù)組被“映射”成對(duì)應(yīng)新數(shù)組。下面這個(gè)例子是數(shù)值項(xiàng)求平方：
var data=[1,3,4]
var Squares=data.map(function(val,index,arr){
console.log(arr[index]==val); // ==> true
return val*val
})
console.log(Squares); // ==> [1, 9, 16]
注意：由于forEach、map都是ECMA5新增數(shù)組的方法，所以ie9以下的瀏覽器還不支持（萬(wàn)惡的IE啊），不過(guò)呢，可以從Array原型擴(kuò)展可以實(shí)現(xiàn)以上全部功能，例如forEach方法:
if (typeof Array.prototype.forEach != "function") {
Array.prototype.forEach = function() {
/* 實(shí)現(xiàn) */
};
}
以上這篇JS中的forEach、$.each、map方法推薦就是小編分享給大家的全部?jī)?nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。
相關(guān)文章
這篇文章主要為大家詳細(xì)介紹了微信小程序?qū)崿F(xiàn)常見(jiàn)彈出層效果 ，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2018-11-11
學(xué)習(xí)javascript面向?qū)ο?javascript實(shí)現(xiàn)繼承的方式
這篇文章主要為大家介紹了javascript實(shí)現(xiàn)繼承的方式，學(xué)習(xí)javascript面向?qū)ο?，感興趣的小伙伴們可以參考一下2016-01-01
js 將多個(gè)對(duì)象合并成一個(gè)對(duì)象 assign方法的實(shí)現(xiàn)
這篇文章主要介紹了js 將多個(gè)對(duì)象合并成一個(gè)對(duì)象 assign方法的實(shí)現(xiàn)，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2020-09-09
前端開(kāi)發(fā)必須知道的JS之閉包及應(yīng)用
本文講的是函數(shù)閉包，不涉及對(duì)象閉包（如用with實(shí)現(xiàn)）。如果你覺(jué)得我說(shuō)的有偏差，歡迎拍磚，歡迎指教。2010-07-07
layui點(diǎn)擊按鈕頁(yè)面會(huì)自動(dòng)刷新的解決方案
今天小編就為大家分享一篇layui點(diǎn)擊按鈕頁(yè)面會(huì)自動(dòng)刷新的解決方案，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2019-10-10
javascript, jquery的事件中都存在事件冒泡和事件捕獲的問(wèn)題，針對(duì)這兩個(gè)問(wèn)題，本文給出詳細(xì)的解決方法，需要的朋友不要錯(cuò)過(guò)2014-05-05
Javascript實(shí)現(xiàn)重力彈跳拖拽運(yùn)動(dòng)效果示例
本文為大家詳細(xì)介紹下使用Javascript實(shí)現(xiàn)重力彈跳拖拽運(yùn)動(dòng)的具體調(diào)用方法，感興趣的朋友可以參考下哈2013-06-06
uniapp項(xiàng)目使用防抖及節(jié)流的方案實(shí)戰(zhàn)
防抖就是指觸發(fā)事件后把觸發(fā)非常頻繁的事件合并成一次去執(zhí)行,節(jié)流是指頻繁觸發(fā)事件時(shí)只會(huì)在指定的時(shí)間段內(nèi)執(zhí)行事件回調(diào),即觸發(fā)事件間隔大于等于指定的時(shí)間才會(huì)執(zhí)行回調(diào)函數(shù),這篇文章主要給大家介紹了關(guān)于uniapp項(xiàng)目使用防抖及節(jié)流的相關(guān)資料,需要的朋友可以參考下2023-01-01
通過(guò)bootstrap全面學(xué)習(xí)less
這篇文章主要為大家詳細(xì)介紹了如何通過(guò)bootstrap學(xué)習(xí)less,LESS CSS是一種動(dòng)態(tài)樣式語(yǔ)言，屬于CSS預(yù)處理語(yǔ)言的一種，感興趣的朋友可以參考下2016-11-11
今天小編就為大家分享一篇layui中table表頭樣式修改方法，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2018-08-08