underscore之function的示例分析

小編給大家分享一下underscore之function的示例分析，相信大部分人都還不怎么了解，因此分享這篇文章給大家參考一下，希望大家閱讀完這篇文章后大有收獲，下面讓我們一起去了解一下吧！

因為underscore本來就是為了充分發揮JavaScript的函數式編程特性，所以也提供了大量JavaScript本身沒有的高階函數。

bind

bind()有什么用？我們先看一個常見的錯誤用法：

'use strict';
console.log('Hello, world!');
// 輸出'Hello, world!'
var log = console.log;
log('Hello, world!');
// Uncaught TypeError: Illegal invocation

如果你想用log()取代console.log()，按照上面的做法是不行的，因為直接調用log()傳入的this指針是undefined，必須這么用：

'use strict';
var log = console.log;
// 調用call并傳入console對象作為this:
log.call(console, 'Hello, world!')
// 輸出Hello, world!

這樣搞多麻煩！還不如直接用console.log()。但是，bind()可以幫我們把console對象直接綁定在log()的this指針上，以后調用log()就可以直接正常調用了：

'use strict';
var log = _.bind(console.log, console);
log('Hello, world!');
// 輸出Hello, world!

partial

partial()就是為一個函數創建偏函數。偏函數是什么東東？看例子：

假設我們要計算xy，這時只需要調用Math.pow(x, y)就可以了。

假設我們經常計算2y，每次都寫Math.pow(2, y)就比較麻煩，如果創建一個新的函數能直接這樣寫pow2N(y)就好了，這個新函數pow2N(y)就是根據Math.pow(x, y)創建出來的偏函數，它固定住了原函數的第一個參數（始終為2）：

'use strict';
var pow2N = _.partial(Math.pow, 2);
pow2N(3); // 8
pow2N(5); // 32
pow2N(10); // 1024

如果我們不想固定第一個參數，想固定第二個參數怎么辦？比如，希望創建一個偏函數cube(x)，計算x3，可以用_作占位符，固定住第二個參數：

'use strict';
var cube = _.partial(Math.pow, _, 3);
cube(3); // 27
cube(5); // 125
cube(10); // 1000

可見，創建偏函數的目的是將原函數的某些參數固定住，可以降低新函數調用的難度。

memoize

如果一個函數調用開銷很大，我們就可能希望能把結果緩存下來，以便后續調用時直接獲得結果。舉個例子，計算階乘就比較耗時：

'use strict';
function factorial(n) {
  console.log('start calculate ' + n + '!...');
  var s = 1, i = n;
  while (i > 1) {
    s = s * i;
    i --;
  }
  console.log(n + '! = ' + s);
  return s;
}
factorial(10); // 3628800
// 注意控制臺輸出:
// start calculate 10!...
// 10! = 3628800
用memoize()就可以自動緩存函數計算的結果：
'use strict';
var factorial = _.memoize(function(n) {
  console.log('start calculate ' + n + '!...');
  var s = 1, i = n;
  while (i > 1) {
    s = s * i;
    i --;
  }
  console.log(n + '! = ' + s);
  return s;
});
// 第一次調用:
factorial(10); // 3628800
// 注意控制臺輸出:
// start calculate 10!...
// 10! = 3628800
// 第二次調用:
factorial(10); // 3628800
// 控制臺沒有輸出

對于相同的調用，比如連續兩次調用factorial(10)，第二次調用并沒有計算，而是直接返回上次計算后緩存的結果。不過，當你計算factorial(9)的時候，仍然會重新計算。

可以對factorial()進行改進，讓其遞歸調用：

'use strict';
var factorial = _.memoize(function(n) {
  console.log('start calculate ' + n + '!...');
  if (n < 2) {
    return 1;
  }
  return n * factorial(n - 1);
});
factorial(10); // 3628800
// 輸出結果說明factorial(1)~factorial(10)都已經緩存了:
// start calculate 10!...
// start calculate 9!...
// start calculate 8!...
// start calculate 7!...
// start calculate 6!...
// start calculate 5!...
// start calculate 4!...
// start calculate 3!...
// start calculate 2!...
// start calculate 1!...
factorial(9); // 362880
// console無輸出

once

顧名思義，once()保證某個函數執行且僅執行一次。如果你有一個方法叫register()，用戶在頁面上點兩個按鈕的任何一個都可以執行的話，就可以用once()保證函數僅調用一次，無論用戶點擊多少次：

'use strict';
var register = _.once(function () {
  alert('Register ok!');
});
// 測試效果:
register();
register();
register();

 delay

delay()可以讓一個函數延遲執行，效果和setTimeout()是一樣的，但是代碼明顯簡單了：

'use strict';
// 2秒后調用alert():
_.delay(alert, 2000);
如果要延遲調用的函數有參數，把參數也傳進去：
'use strict';
var log = _.bind(console.log, console);
_.delay(log, 2000, 'Hello,', 'world!');
// 2秒后打印'Hello, world!':

以上是“underscore之function的示例分析”這篇文章的所有內容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內容對大家有所幫助，如果還想學習更多知識，歡迎關注億速云行業資訊頻道！