JS中的 map, filter, some, every, forEach, for in, for of 用法總結(jié)

1. map

// 有返回值祭犯,返回一個(gè)新的數(shù)組忱辅,每個(gè)元素為調(diào)用func的結(jié)果。
let list = [1, 2, 3, 4, 5];
let other = list.map((d, i) => {
  return d * 2;
});
console.log(other);
// [2, 4, 6, 8, 10]

2.filter

// 有返回值霉囚,返回一個(gè)符合func條件的元素?cái)?shù)組
let list = [1, 2, 3, 4, 5];
let other = list.filter((d, i) => {
  return d % 2;
});
console.log(other);
// [1, 3, 5]

3.some

// 返回一個(gè)boolean捕仔,判斷是否有元素符合func條件,如果有一個(gè)元素符合func條件盈罐,則循環(huán)會(huì)終止榜跌。
let list = [1, 2, 3, 4, 5];
list.some((d, i) => {
  console.log(d, i);
  return d > 3;
});
// print: 1 0,  2 1,  3 2,  4 3
// return true

4.every

// 返回一個(gè)boolean,判斷每個(gè)元素是否符合func條件盅粪,有一個(gè)元素不滿足func條件钓葫,則循環(huán)終止,返回false票顾。
let list = [1, 2, 3, 4, 5];
list.every((d, i) => {
  console.log(d, i);
  return d < 3;
});
// print: 1 0,  2 1,  3 2
// return false

5.forEach

// 沒(méi)有返回值础浮,只針對(duì)每個(gè)元素調(diào)用func。
// 優(yōu)點(diǎn):代碼簡(jiǎn)介奠骄。
// 缺點(diǎn):無(wú)法使用break豆同,return等終止循環(huán)。
let list = [1, 2, 3, 4, 5];
let other = [];
list.forEach((d, i) => {
  other.push(d * 2);
});
console.log(other);
// print: [2, 4, 6, 8, 10]

6.for in

// for-in循環(huán)實(shí)際是為循環(huán)“enumerable”對(duì)象而設(shè)計(jì)的戚揭,for in也可以循環(huán)數(shù)組诱告,但是不推薦這樣使用,for–in是用來(lái)循環(huán)帶有字符串key的對(duì)象的方法民晒。
// 缺點(diǎn):只能獲得對(duì)象的鍵名精居,不能直接獲取鍵值。
var obj = {a:1, b:2, c:3};
for (var prop in obj) {
 console.log("obj." + prop + " = " + obj[prop]);
}
// print: "obj.a = 1" "obj.b = 2" "obj.c = 3"

7.for of

for of為ES6提供潜必,具有iterator接口靴姿,就可以用for of循環(huán)遍歷它的成員。也就是說(shuō)磁滚,for of循環(huán)內(nèi)部調(diào)用的是數(shù)據(jù)結(jié)構(gòu)的Symbol.iterator方法佛吓。
for of循環(huán)可以使用的范圍包括數(shù)組、Set和Map結(jié)構(gòu)垂攘、某些類(lèi)似數(shù)組的對(duì)象(比如arguments對(duì)象维雇、DOM NodeList對(duì)象)、后文的Generator對(duì)象晒他,以及字符串吱型。
有些數(shù)據(jù)結(jié)構(gòu)是在現(xiàn)有數(shù)據(jù)結(jié)構(gòu)的基礎(chǔ)上,計(jì)算生成的陨仅。比如津滞,ES6的數(shù)組铝侵、Set、Map都部署了以下三個(gè)方法触徐,調(diào)用后都返回遍歷器對(duì)象咪鲜。

  • entries
    entries() 返回一個(gè)遍歷器對(duì)象,用來(lái)遍歷[鍵名, 鍵值]組成的數(shù)組撞鹉。對(duì)于數(shù)組疟丙,鍵名就是索引值;對(duì)于Set鸟雏,鍵名與鍵值相同隆敢。Map結(jié)構(gòu)的iterator接口,默認(rèn)就是調(diào)用entries方法崔慧。
  • keys
    keys() 返回一個(gè)遍歷器對(duì)象,用來(lái)遍歷所有的鍵名穴墅。
  • values
    values() 返回一個(gè)遍歷器對(duì)象惶室,用來(lái)遍歷所有的鍵值。
    這三個(gè)方法調(diào)用后生成的遍歷器對(duì)象玄货,所遍歷的都是計(jì)算生成的數(shù)據(jù)結(jié)構(gòu)皇钞。
// 字符串
let str = "hello";
for (let s of str) {
 console.log(s); // h e l l o
}
// 遍歷數(shù)組
let list = [1, 2, 3, 4, 5];
for (let e of list) {
  console.log(e);
}
// print: 1 2 3 4 5
// 遍歷對(duì)象
obj = {a:1, b:2, c:3};
for (let key of Object.keys(obj)) {
 console.log(key, obj[key]);
}
// print: a 1 b 2 c 3

說(shuō)明:對(duì)于普通的對(duì)象,for...in循環(huán)可以遍歷鍵名松捉,for...of循環(huán)會(huì)報(bào)錯(cuò)夹界。
一種解決方法是,使用Object.keys方法將對(duì)象的鍵名生成一個(gè)數(shù)組隘世,然后遍歷這個(gè)數(shù)組可柿。

// entries
let arr = ['a', 'b', 'c'];
for (let pair of arr.entries()) {
 console.log(pair);
}
// [0, 'a']
// [1, 'b']
// [2, 'c']

出處:https://www.jb51.net/article/109833.htm

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個(gè)濱河市丙者,隨后出現(xiàn)的幾起案子复斥,更是在濱河造成了極大的恐慌,老刑警劉巖械媒,帶你破解...
    沈念sama閱讀 206,311評(píng)論 6 481
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件目锭,死亡現(xiàn)場(chǎng)離奇詭異,居然都是意外死亡纷捞,警方通過(guò)查閱死者的電腦和手機(jī)痢虹,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 88,339評(píng)論 2 382
  • 文/潘曉璐 我一進(jìn)店門(mén),熙熙樓的掌柜王于貴愁眉苦臉地迎上來(lái)主儡,“玉大人奖唯,你說(shuō)我怎么就攤上這事∽罕纾” “怎么了臭埋?”我有些...
    開(kāi)封第一講書(shū)人閱讀 152,671評(píng)論 0 342
  • 文/不壞的土叔 我叫張陵踪央,是天一觀的道長(zhǎng)。 經(jīng)常有香客問(wèn)我瓢阴,道長(zhǎng)畅蹂,這世上最難降的妖魔是什么? 我笑而不...
    開(kāi)封第一講書(shū)人閱讀 55,252評(píng)論 1 279
  • 正文 為了忘掉前任荣恐,我火速辦了婚禮液斜,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘叠穆。我一直安慰自己少漆,他們只是感情好,可當(dāng)我...
    茶點(diǎn)故事閱讀 64,253評(píng)論 5 371
  • 文/花漫 我一把揭開(kāi)白布硼被。 她就那樣靜靜地躺著示损,像睡著了一般。 火紅的嫁衣襯著肌膚如雪嚷硫。 梳的紋絲不亂的頭發(fā)上检访,一...
    開(kāi)封第一講書(shū)人閱讀 49,031評(píng)論 1 285
  • 那天,我揣著相機(jī)與錄音仔掸,去河邊找鬼脆贵。 笑死,一個(gè)胖子當(dāng)著我的面吹牛起暮,可吹牛的內(nèi)容都是我干的卖氨。 我是一名探鬼主播,決...
    沈念sama閱讀 38,340評(píng)論 3 399
  • 文/蒼蘭香墨 我猛地睜開(kāi)眼负懦,長(zhǎng)吁一口氣:“原來(lái)是場(chǎng)噩夢(mèng)啊……” “哼筒捺!你這毒婦竟也來(lái)了?” 一聲冷哼從身側(cè)響起密似,我...
    開(kāi)封第一講書(shū)人閱讀 36,973評(píng)論 0 259
  • 序言:老撾萬(wàn)榮一對(duì)情侶失蹤焙矛,失蹤者是張志新(化名)和其女友劉穎,沒(méi)想到半個(gè)月后残腌,有當(dāng)?shù)厝嗽跇?shù)林里發(fā)現(xiàn)了一具尸體村斟,經(jīng)...
    沈念sama閱讀 43,466評(píng)論 1 300
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 35,937評(píng)論 2 323
  • 正文 我和宋清朗相戀三年抛猫,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了蟆盹。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點(diǎn)故事閱讀 38,039評(píng)論 1 333
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡闺金,死狀恐怖逾滥,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情,我是刑警寧澤寨昙,帶...
    沈念sama閱讀 33,701評(píng)論 4 323
  • 正文 年R本政府宣布讥巡,位于F島的核電站,受9級(jí)特大地震影響舔哪,放射性物質(zhì)發(fā)生泄漏欢顷。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 39,254評(píng)論 3 307
  • 文/蒙蒙 一捉蚤、第九天 我趴在偏房一處隱蔽的房頂上張望抬驴。 院中可真熱鬧,春花似錦缆巧、人聲如沸布持。這莊子的主人今日做“春日...
    開(kāi)封第一講書(shū)人閱讀 30,259評(píng)論 0 19
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)题暖。三九已至,卻和暖如春捉超,著一層夾襖步出監(jiān)牢的瞬間芙委,已是汗流浹背。 一陣腳步聲響...
    開(kāi)封第一講書(shū)人閱讀 31,485評(píng)論 1 262
  • 我被黑心中介騙來(lái)泰國(guó)打工狂秦, 沒(méi)想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留,地道東北人推捐。 一個(gè)月前我還...
    沈念sama閱讀 45,497評(píng)論 2 354
  • 正文 我出身青樓裂问,卻偏偏與公主長(zhǎng)得像,于是被迫代替她去往敵國(guó)和親牛柒。 傳聞我的和親對(duì)象是個(gè)殘疾皇子堪簿,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 42,786評(píng)論 2 345