摘要：也可以直接調(diào)用內(nèi)置方法常用高階函數(shù)方法的作用是接收一個(gè)函數(shù)作為參數(shù)，對(duì)數(shù)組中每個(gè)元素按順序調(diào)用一次傳入的函數(shù)并返回結(jié)果，不改變?cè)瓟?shù)組，返回一個(gè)新數(shù)組。

Ps. 晚上加班到快十點(diǎn)，回來(lái)趕緊整理整理這篇文章，今天老大給我推薦了一篇文章，我從寫(xiě)技術(shù)博客中收獲到了什么？- J_Knight_，感受也是很多，自己也需要慢慢養(yǎng)成記錄博客的習(xí)慣，即使起步艱難，難以堅(jiān)持，但還是要讓自己加油加油。
前兩天把我整理的【復(fù)習(xí)資料】ES6/ES7/ES8/ES9資料整理(個(gè)人整理)要分享給大家啦。

正文內(nèi)容開(kāi)始：

個(gè)人簡(jiǎn)單理解為，一個(gè)函數(shù)可以接收其他函數(shù)作為參數(shù)，這種函數(shù)便稱為高階函數(shù)，而主要目的就是為了能接收其他函數(shù)作為參數(shù)。

Q： 為什么可以接收一個(gè)函數(shù)作為參數(shù)？   
A： 因?yàn)楹瘮?shù)可以接收變量作為參數(shù)，而變量可以聲明一個(gè)方法。

簡(jiǎn)單實(shí)例：

function a (x){
    return "hi " + x;
}
function f (a, b){
    return a(b);
}
f(a, "leo");   // "hi leo"

這段代碼的意思：定義方法f，接收兩個(gè)參數(shù)，方法a和變量b，在方法a中返回一段字符串，當(dāng)執(zhí)行方法f并傳入?yún)?shù)方法a和參數(shù)b的時(shí)候，返回"hi leo"。

也可以直接調(diào)用JS內(nèi)置方法：

let a = 3, b = -2;
function my_abs (val, fun){
    return fun(val);
}
my_abs(a, Math.abs);  // 3
my_abs(b, Math.abs);  // 2

map()方法的作用是：接收一個(gè)函數(shù)作為參數(shù)，對(duì)數(shù)組中每個(gè)元素按順序調(diào)用一次傳入的函數(shù)并返回結(jié)果，不改變?cè)瓟?shù)組，返回一個(gè)新數(shù)組。
通常使用方式：arr.map(callback())，更多詳細(xì)介紹可以參考 MDN Array.map()。
參數(shù)：

arr : 需要操作的數(shù)組；

callback(currentValue, index, array, thisArg) : 處理的方法，四個(gè)參數(shù)；

currentValue 當(dāng)前處理的元素的值

index 當(dāng)前處理的元素的索引，可選

array 調(diào)用map()方法的數(shù)組，可選

currentVthisArgalue 執(zhí)行 callback 函數(shù)時(shí)使用的 this 值，可選

返回值：
返回一個(gè)處理后的新數(shù)組。

實(shí)例：

let arr = [1, 3, -5];
let a1 = arr.map(Math.abs);  
// a1 => [1, 3, 5];

let a2 = arr.map(String);
// a2 => ["1", "3", "-5"]

let a3 = arr.map(function (x){
    return x + 1;
})
// 等價(jià)于 a3=arr.map(x => x+1)
// a3 => [2, 4, -4]

對(duì)比 for...in 循環(huán)，map()書(shū)寫(xiě)起來(lái)更加簡(jiǎn)潔：

let arr = [1, 3, -5];
let a1 = [];
for (var i=0; i [2, 4, -4]

map()作為高階函數(shù)，事實(shí)上它把運(yùn)算規(guī)則抽象了。

reduce()方法的作用是：接收一個(gè)函數(shù)，對(duì)數(shù)組進(jìn)行累加操作，把累計(jì)結(jié)果和下一個(gè)值進(jìn)行操作，最后返回最終的單個(gè)結(jié)果值。

通常使用方式：arr.reduce(callback(), initValue)，更多詳細(xì)介紹可以參考 MDN Array.reduce()

參數(shù)：

callback(returnValue, currentValue, currentIndex, array) : 累記器的方法，四個(gè)參數(shù)：

returnValue 上一次處理的返回值，或者初始值

currentValue 當(dāng)前處理的元素的值，可選

currentIndex 當(dāng)前處理的元素的索引，可選

array 調(diào)用reduce()方法的數(shù)組，可選

initValue 初次調(diào)用callback()時(shí)候returnValue參數(shù)的初始值，默認(rèn)數(shù)組第一個(gè)元素，可選

返回值：
返回一個(gè)最終的累計(jì)值。

實(shí)例：

數(shù)組求和

let arr = [1, 3, -5];
let sum1 = arr.reduce((res, cur) => res + cur);
// sum1 => -1

let sum2 = arr.reduce((res, cur) => res + cur , 1);
// sum1 => 0

二維數(shù)組轉(zhuǎn)化為一維

let arr = [[1, 2], [3, 4], [5, 6]];
let con = arr.reduce((res, cur) => res.concat(cur));
// con => [1, 2, 3, 4, 5, 6]

filter()方法的作用是：接收一個(gè)函數(shù)，依次作用數(shù)組每個(gè)元素，并過(guò)濾符合函數(shù)條件的元素，將剩下的數(shù)組作為一個(gè)新數(shù)組返回。

通常使用方式：arr.filter(callback(), thisArg)，更多詳細(xì)介紹可以參考 MDN Array.filter()

參數(shù)：

callback(ele, index, array) : 過(guò)濾條件的方法，當(dāng)返回true則保存該元素，反之不保留，三個(gè)參數(shù)：

ele 當(dāng)前處理的元素

index 當(dāng)前處理的元素的索引，可選

array 調(diào)用filter()方法的數(shù)組，可選

thisArg 執(zhí)行 callback 時(shí)的用于 this 的值，可選

返回值：
返回一個(gè)過(guò)濾剩下的元素組成的新數(shù)組。

實(shí)例：

過(guò)濾奇數(shù)值

let arr = [1, 2, 3, 4, 5, 6];
let res = arr.filter(x => x % 2 != 0);
// res => [1, 3, 5]

過(guò)濾不滿足條件的值

let arr = [1, 2, 3, 4, 5, 6];
let res = arr.filter(x => x > 3);
// res => [4, 5, 6]

過(guò)濾空字符串

let arr = ["a", "", null, undefined, "b", ""];
let tri = arr.filter(x => x && x.trim());
// tri => ["a", "b"]

總結(jié)下： filter()主要作為篩選功能，因此核心就是正確實(shí)現(xiàn)一個(gè)“篩選”函數(shù)。

sort()方法的作用是：接收一個(gè)函數(shù)，對(duì)數(shù)組的元素進(jìn)行排序，并返回排序后的新數(shù)組。默認(rèn)排序順序是根據(jù)字符串Unicode碼點(diǎn)。

通常使用方式：arr.sort(fun())，更多詳細(xì)介紹可以參考 MDN Array.sort()
compareFunction 可選
用來(lái)指定按某種順序進(jìn)行排列的函數(shù)。如果省略，元素按照轉(zhuǎn)換為的字符串的各個(gè)字符的Unicode位點(diǎn)進(jìn)行排序。
參數(shù)：

fun(a, b) : 指定按某種順序進(jìn)行排列的函數(shù)，若省略則按照轉(zhuǎn)換為的字符串的各個(gè)字符的Unicode位點(diǎn)進(jìn)行排序，兩個(gè)可選參數(shù)：

fun() 返回 a和b兩個(gè)值的大小的比較結(jié)果，sort()根據(jù)返回結(jié)果進(jìn)行排序：

若 fun(a, b) 小于 0 ，則 a 排在 b 前面；

若 fun(a, b) 等于 0 ，則 a b 位置不變；

若 fun(a, b) 大于 0 ，則 a 排在 b 后面；

返回值：
返回排序后的新數(shù)組，并修改原數(shù)組。

實(shí)例：

升序降序數(shù)組

let arr = [1,5,2,3];
let sort1 = arr.sort();
// 等同于 let sort1 = arr.sort((a, b) => a - b);
// sort1 => [1, 2, 3, 5]

let sort2 = arr.sort((a, b) => b - a);
// sort2 => [5, 3, 2, 1]

字符串排序

let arr1 = ["AA", "CC", "BB"];
let sort1 = arr1.sort();
// sort1 => ["AA", "BB", "CC"]

let arr2 = ["AA", "aa", "BB"];
let sort2 = arr2.sort();
// sort2 => ["AA", "BB", "aa"]

let arr3 = ["AA", "aa", "BB"];
let sort3 = arr3.sort((a, b) => a.toLowerCase() > b.toLowerCase());
// sort3 =>?["AA", "aa", "BB"]
// 也可以寫(xiě)成：
let sort3 = arr3.sort((a, b) => {
    let s1 = a.toLowerCase();
    let s2 = b.toLowerCase();
    return s1 > s2 ? 1 : s1 < s2 ? -1 : 0;
})

總結(jié)下： sort()主要作為排序功能，因此核心就是正確實(shí)現(xiàn)一個(gè)“排序”函數(shù)。

阮一峰 JS高階函數(shù)

分享的內(nèi)容比較簡(jiǎn)單，但是還是希望能幫助到需要的人哈。~~感謝

歡迎關(guān)注微信公眾號(hào)【前端自習(xí)課】每天早晨，與您一起學(xué)習(xí)一篇優(yōu)秀的前端技術(shù)博文 .