高階函數的定義
在《javascript設計模式和開發實踐》中是這樣定義的。
- 函數可以作為參數被傳遞；
- 函數可以作為返回值輸出。
結合這兩個特點，首先想到的肯定是回調函數，回調函數也是高階函數的一種，除了回調函數，還有很多的高階函數，這篇文章主要是惰性函數、柯里化函數、compose函數這三種。
一、惰性函數
概念
懶，執行過一遍的東西，如果第二遍執行還是一樣的效果，則我們就不想讓其重復執行第二遍了
栗子
我們要封裝一個獲取元素屬性的方法，因為低版本的ie瀏覽器不支持getComputedStyle方法，做了一個容錯處理
function getCss(element, attr) {if ('getComputedStyle' in window) {return window.getComputedStyle(element)[attr];}return element.currentStyle[attr];
}但是每次進這個方法都要做一下判斷，為了提高性能，我們可以存一個變量，然后每次進去判斷變量就好了
var flag = 'getComputedStyle' in window
function getCss(element, attr) {if (flag) {return window.getComputedStyle(element)[attr];}return element.currentStyle[attr];
}這樣每一次還是需要判斷，有沒有更好的方法呢？惰性函數的思想就可以完美解決這個問題
function getCss(element, attr) {if ('getComputedStyle' in window) {getCss = function (element, attr) {return window.getComputedStyle(element)[attr];};} else {getCss = function (element, attr) {return element.currentStyle[attr];};}// 為了第一次也能拿到值return getCss(element, attr);
}getCss(document.body, 'margin');
getCss(document.body, 'padding');
getCss(document.body, 'width');第一次執行，如果有getComputedStyle這個方法，getCss就被賦值成
function (element, attr) {return window.getComputedStyle(element)[attr];
};而后的每一次就會執行上面這個函數，否則則相反
總結
惰性載入函數有兩個主要優點，
- 1、是顯而易見的效率問題，雖然在第一次執行的時候函數會意味賦值而執行的慢一些，但是后續的調用會因為避免的重復檢測更快；
- 2、是要執行的適當代碼只有當實際調用函數是才執行，很多JavaScript庫在在加載的時候就根據瀏覽器不同而執行很多分支，把所有東西實現設置好，而惰性載入函數將計算延遲，不影響初始腳本的執行時間。
二、函數柯理化
定義
利用閉包保存機制，把一些信息預先存儲下來（預處理的思想）
function fn() {}
let res = fn(1, 2)(3);
console.log(res); //=>6 1+2+3封裝一個方法，調用以后求出和（兩次執行的傳參個數都不固定）
解題思路：
函數第二次執行，第一個函數的返回值一定是一個函數,第二個函數的返回值應該是求和的數值function fn(...outerArgs) {return function anonymous(...innerArgs) {// args:外層和里層函數傳遞的所有值都合并在一起let args = outerArgs.concat(innerArgs);return args.reduce((n, item) => n + item);};
}第二個函數使用了第一個函數的值，所以函數1不會被釋放，利用閉包的保護機制，將值預先保存起來
三、compose函數
定義
組合函數，把多層函數嵌套調用扁平化
栗子
下面四個方法，每種方法都會把參數0進行處理，給x傳一個值如果要得出四種方法以后的和：
const fn1 = (x, y) => x + y + 10;
const fn2 = x => x - 10;
const fn3 = x => x * 10;
const fn4 = x => x / 10;let res = fn4(fn2(fn3(fn1(20))));
let res1 = compose(fn1, fn3, fn2, fn4)(20, 30);res得出的值，可以實現這個需求，但是需要函數套函數，現在可以定義一個compose函數，使得res和res1的值相等，將函數實現扁平化
function compose(...funcs) {// FUNCS:存儲按照順序執行的函數(數組) =>[fn1, fn3, fn2, fn4]return function anonymous(...args) {// ARGS:存儲第一個函數執行需要傳遞的實參信息(數組) =>[20]if (funcs.length === 0) return args;if (funcs.length === 1) return funcs[0](...args);return funcs.reduce((N, func) => {// 第一次N的值:第一個函數執行的實參 func是第一個函數// 第二次N的值:上一次func執行的返回值，作為實參傳遞給下一個函數執行return Array.isArray(N) ? func(...N) : func(N);}, args);};
}完美實現compose函數，不用再函數套函數
react中的redux源碼中的compose函數用的是另外思想實現的
四、單例設計模式
定義
var obj1 = {name: 'wanghuahua'
}
var obj2 = {name: 'jerry'
}
console.log(obj1.name)
console.log(obj2.name)上面的兩個obj就是最基礎的單例
單例模式就是：用單獨的實例來管理當前事物的相關特征[屬性和方法]（類似于實現一個分組的特點）
而此時obj1/obj2不僅僅叫做一個對象，也被成為命名空間
特點
- 類只有一個實例
- 全局可訪問該實例
- 自行實例化（主動實例化）
- 可推遲初始化，即延遲執行（與靜態類/對象的區別）
雖然全局變量可以實現單例，但因其自身的問題，不建議在實際項目中將其作為單例模式的應用，特別是中大型項目的應用中，全局變量的維護該是考慮的成本。
高級單例設計模式
基于閉包管控的單例模式稱為：高級單例設計模式，以此來實現模塊劃分（最早的模塊化思想）
let wanghuahua = (function () {function query() {}function tools() {}return {name: 'AREA',tools};
})();
wanghuahua.tools();let jerry = (function () {function fn() {meimei.getXxx();}function query() {}return {query}
})();let meimei = (function () {function fn() {}function getXxx() {}jerry.query();return {getXxx}
})();
// 每個模塊都可以有自己私有的方法，想要暴露給全局的就return出去// es6的export已經不需要這么寫了公眾號：
)
