JS 數(shù)組高階函數(shù)

JavaScript的函數(shù)其實(shí)都指向某個(gè)變量恶耽。既然變量可以指向函數(shù)偎痛,函數(shù)的參數(shù)能接收變量,那么一個(gè)函數(shù)就可以接收另一個(gè)函數(shù)作為參數(shù)耘子,這種函數(shù)就稱之為高階函數(shù)。

一個(gè)最簡(jiǎn)單的高階函數(shù):

function add(x, y, f) {
    return f(x) + f(y);
}

Map

定義和用法:

map() 方法返回一個(gè)新數(shù)組球切,數(shù)組中的元素為原始數(shù)組元素調(diào)用函數(shù)處理后的值谷誓。

map() 方法按照原始數(shù)組元素順序依次處理元素。map()作為高階函數(shù)吨凑,事實(shí)上它把運(yùn)算規(guī)則抽象了捍歪。

arr.map(function(currentValue,index鸵钝,arr),thisValue) 

參數(shù):

currentValue 必須 當(dāng)前元素值

index 可選 當(dāng)前元素的索引值

arr 可選 當(dāng)前元素屬于的數(shù)組對(duì)象糙臼。

thisvalue 可選 對(duì)象作為該執(zhí)行回調(diào)時(shí)使用,傳遞給函數(shù)恩商,用作 "this" 的值变逃。

實(shí)例:

function pow(x) {
 return x * x;
} 
var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9]; 
var results = arr.map(pow); // [1, 4, 9, 16, 25, 36, 49, 64, 81]

reduce

reduce() 方法接收一個(gè)函數(shù)作為累加器,數(shù)組中的每個(gè)值(從左到右)開(kāi)始縮減痕届,最終計(jì)算為一個(gè)值韧献。

語(yǔ)法:

array.reduce(function(total, currentValue, currentIndex, arr), initialValue)

| total | 必需。初始值, 或者計(jì)算結(jié)束后的返回值研叫。 |

Array的reduce()把一個(gè)函數(shù)作用在這個(gè)Array[x1, x2, x3...]上锤窑,這個(gè)函數(shù)必須接收兩個(gè)參數(shù),reduce()把結(jié)果繼續(xù)和序列的下一個(gè)元素做累積計(jì)算嚷炉,其效果就是:

[x1, x2, x3, x4].reduce(f) = f(f(f(x1, x2), x3), x4)

比方說(shuō)對(duì)一個(gè)Array求和渊啰,就可以用reduce實(shí)現(xiàn):

arr.reduce(function (x, y) { 
return x + y;
}); 
// 25 //第一步x=1 y=3 第二步 x=4 y=5 第三步 x=9 y=7 ……

要把[1, 3, 5, 7, 9]變換成整數(shù)13579,reduce()也能派上用場(chǎng):

arr.reduce(function (x, y) {
 return x * 10 + y;
});                // 13579

練習(xí):

一個(gè)字符串“13579"先變成Array——[1, 3, 5, 7, 9]申屹,再利用reduce()就可以寫出一個(gè)把字符串轉(zhuǎn)換為Number的函數(shù)绘证。

不要使用JavaScript內(nèi)置的parseInt()函數(shù),利用map和reduce操作實(shí)現(xiàn)一個(gè)string2int()函數(shù):

function string2int(s) {
    let arr = s.split('')    
    arr=arr.map(x => x*1 ); 
    return arr.reduce((x,y) =>  x*10+y)
}

filter

filter也是一個(gè)常用的操作哗讥,它用于把Array的某些元素過(guò)濾掉嚷那,然后返回剩下的元素。

map()類似杆煞,Arrayfilter()也接收一個(gè)函數(shù)魏宽。map()不同的是,filter()把傳入的函數(shù)依次作用于每個(gè)元素决乎,然后根據(jù)返回值是true還是false決定保留還是丟棄該元素队询。

例如,在一個(gè)Array中构诚,刪掉偶數(shù)蚌斩,只保留奇數(shù),可以這么寫:

var arr = [1, 2, 4, 5, 6, 9, 10, 15]; 
var r = arr.filter(x =>  return x % 2 !== 0;);
r; // [1, 5, 9, 15]

把一個(gè)Array中的空字符串刪掉范嘱,可以這么寫:

var arr = ['A', '', 'B', null, undefined, 'C', '  '];
var r = arr.filter(s => s && s.trim();) // 注意:IE9以下的版本沒(méi)有trim()方法
r; // ['A', 'B', 'C']

sort

無(wú)論使用冒泡排序還是快速排序送膳,排序的核心是比較兩個(gè)元素的大小员魏。如果是數(shù)字,我們可以直接比較肠缨,但如果是字符串或者兩個(gè)對(duì)象呢逆趋?直接比較數(shù)學(xué)上的大小是沒(méi)有意義的,因此晒奕,比較的過(guò)程必須通過(guò)函數(shù)抽象出來(lái)闻书。通常規(guī)定,對(duì)于兩個(gè)元素xy脑慧,如果認(rèn)為x < y魄眉,則返回-1,如果認(rèn)為x == y闷袒,則返回0坑律,如果認(rèn)為x > y,則返回1囊骤,這樣晃择,排序算法就不用關(guān)心具體的比較過(guò)程,而是根據(jù)比較結(jié)果直接排序也物。

var arr = [10, 20, 1, 2];
arr.sort(function (x, y) { 
if (x < y) { 
return -1;
}
if (x > y) {
 return 1;
}
 return 0;
});
console.log(arr); // [1, 2, 10, 20]
  • 若 a 小于 b宫屠,在排序后的數(shù)組中 a 應(yīng)該出現(xiàn)在 b 之前,則返回一個(gè)小于 0 的值滑蚯。
  • 若 a 等于 b浪蹂,則返回 0。
  • 若 a 大于 b告材,則返回一個(gè)大于 0 的值坤次。

注:sort()方法會(huì)直接對(duì)Array進(jìn)行修改,它返回的結(jié)果仍是當(dāng)前Array

var a1 = ['B', 'A', 'C'];
var a2 = a1.sort();
a1; // ['A', 'B', 'C']
a2; // ['A', 'B', 'C']
a1 === a2; // true, a1和a2是同一對(duì)象

every

every()方法可以判斷數(shù)組的所有元素是否滿足測(cè)試條件斥赋。

例如缰猴,給定一個(gè)包含若干字符串的數(shù)組,判斷所有字符串是否滿足指定的測(cè)試條件:

var arr = ['Apple', 'pear', 'orange'];
console.log(arr.every(s =>  s.length > 0;));    // true, 因?yàn)槊總€(gè)元素都滿足s.length>0

console.log(arr.every(s => s.toLowerCase() === s;)); // false, 因?yàn)椴皇敲總€(gè)元素都全部是小寫

find

find()方法用于查找符合條件的第一個(gè)元素疤剑,如果找到了洛波,返回這個(gè)元素,否則骚露,返回undefined

var arr = ['Apple', 'pear', 'orange'];
console.log(arr.find(function (s) { 
  return s.toLowerCase() === s;
  })
); // 'pear', 因?yàn)閜ear全部是小寫

console.log(arr.find(function (s) { 
  return s.toUpperCase() === s;
  })
); // undefined, 因?yàn)闆](méi)有全部是大寫的元素

findIndex

findIndex()find()類似,也是查找符合條件的第一個(gè)元素缚窿,不同之處在于findIndex()會(huì)返回這個(gè)元素的索引棘幸,如果沒(méi)有找到,返回-1

var arr = ['Apple', 'pear', 'orange'];
console.log(arr.findIndex(function (s) { 
  return s.toLowerCase() === s;
  })
); // 1, 因?yàn)?pear'的索引是1

console.log(arr.findIndex(function (s) { 
  return s.toUpperCase() === s;
  })
); // -1

forEach

forEach()map()類似倦零,它也把每個(gè)元素依次作用于傳入的函數(shù)误续,但不會(huì)返回新的數(shù)組吨悍。forEach()常用于遍歷數(shù)組,因此蹋嵌,傳入的函數(shù)不需要返回值:

var arr = ['Apple', 'pear', 'orange'];
arr.forEach(s => console.log(s);)// 依次打印每個(gè)元素

原文地址:
https://www.liaoxuefeng.com/wiki/1022910821149312/1023021271742944
https://www.cnblogs.com/liangtao999/p/11795460.html

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末育瓜,一起剝皮案震驚了整個(gè)濱河市,隨后出現(xiàn)的幾起案子栽烂,更是在濱河造成了極大的恐慌躏仇,老刑警劉巖,帶你破解...
    沈念sama閱讀 218,546評(píng)論 6 507
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件腺办,死亡現(xiàn)場(chǎng)離奇詭異焰手,居然都是意外死亡,警方通過(guò)查閱死者的電腦和手機(jī)怀喉,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 93,224評(píng)論 3 395
  • 文/潘曉璐 我一進(jìn)店門书妻,熙熙樓的掌柜王于貴愁眉苦臉地迎上來(lái),“玉大人躬拢,你說(shuō)我怎么就攤上這事躲履。” “怎么了聊闯?”我有些...
    開(kāi)封第一講書人閱讀 164,911評(píng)論 0 354
  • 文/不壞的土叔 我叫張陵工猜,是天一觀的道長(zhǎng)。 經(jīng)常有香客問(wèn)我馅袁,道長(zhǎng)域慷,這世上最難降的妖魔是什么? 我笑而不...
    開(kāi)封第一講書人閱讀 58,737評(píng)論 1 294
  • 正文 為了忘掉前任汗销,我火速辦了婚禮犹褒,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘弛针。我一直安慰自己叠骑,他們只是感情好,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,753評(píng)論 6 392
  • 文/花漫 我一把揭開(kāi)白布削茁。 她就那樣靜靜地躺著宙枷,像睡著了一般。 火紅的嫁衣襯著肌膚如雪茧跋。 梳的紋絲不亂的頭發(fā)上慰丛,一...
    開(kāi)封第一講書人閱讀 51,598評(píng)論 1 305
  • 那天,我揣著相機(jī)與錄音瘾杭,去河邊找鬼诅病。 笑死,一個(gè)胖子當(dāng)著我的面吹牛,可吹牛的內(nèi)容都是我干的贤笆。 我是一名探鬼主播蝇棉,決...
    沈念sama閱讀 40,338評(píng)論 3 418
  • 文/蒼蘭香墨 我猛地睜開(kāi)眼,長(zhǎng)吁一口氣:“原來(lái)是場(chǎng)噩夢(mèng)啊……” “哼芥永!你這毒婦竟也來(lái)了篡殷?” 一聲冷哼從身側(cè)響起,我...
    開(kāi)封第一講書人閱讀 39,249評(píng)論 0 276
  • 序言:老撾萬(wàn)榮一對(duì)情侶失蹤埋涧,失蹤者是張志新(化名)和其女友劉穎板辽,沒(méi)想到半個(gè)月后,有當(dāng)?shù)厝嗽跇?shù)林里發(fā)現(xiàn)了一具尸體飞袋,經(jīng)...
    沈念sama閱讀 45,696評(píng)論 1 314
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡戳气,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,888評(píng)論 3 336
  • 正文 我和宋清朗相戀三年,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了巧鸭。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片瓶您。...
    茶點(diǎn)故事閱讀 40,013評(píng)論 1 348
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡,死狀恐怖纲仍,靈堂內(nèi)的尸體忽然破棺而出呀袱,到底是詐尸還是另有隱情,我是刑警寧澤郑叠,帶...
    沈念sama閱讀 35,731評(píng)論 5 346
  • 正文 年R本政府宣布夜赵,位于F島的核電站,受9級(jí)特大地震影響乡革,放射性物質(zhì)發(fā)生泄漏寇僧。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,348評(píng)論 3 330
  • 文/蒙蒙 一沸版、第九天 我趴在偏房一處隱蔽的房頂上張望嘁傀。 院中可真熱鬧,春花似錦视粮、人聲如沸细办。這莊子的主人今日做“春日...
    開(kāi)封第一講書人閱讀 31,929評(píng)論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)笑撞。三九已至,卻和暖如春钓觉,著一層夾襖步出監(jiān)牢的瞬間茴肥,已是汗流浹背。 一陣腳步聲響...
    開(kāi)封第一講書人閱讀 33,048評(píng)論 1 270
  • 我被黑心中介騙來(lái)泰國(guó)打工荡灾, 沒(méi)想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留炉爆,地道東北人堕虹。 一個(gè)月前我還...
    沈念sama閱讀 48,203評(píng)論 3 370
  • 正文 我出身青樓,卻偏偏與公主長(zhǎng)得像芬首,于是被迫代替她去往敵國(guó)和親。 傳聞我的和親對(duì)象是個(gè)殘疾皇子逼裆,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 44,960評(píng)論 2 355