前言
本文主要給大家介紹了關于JavaScript惰性函數的相關內容,分享出來供大家參考學習,下面話不多說了,來一起看看詳細的介紹吧。
需求
我們現在需要寫一個 foo 函數,這個函數返回首次調用時的 Date 對象,注意是首次。
解決一:普通方法
var t;function foo() { if (t) return t; t = new Date() return t;}問題有兩個,一是污染了全局變量,二是每次調用 foo 的時候都需要進行一次判斷。
解決二:閉包
我們很容易想到用閉包避免污染全局變量。
var foo = (function() { var t; return function() { if (t) return t; t = new Date(); return t; }})();然而還是沒有解決調用時都必須進行一次判斷的問題。
解決三:函數對象
函數也是一種對象,利用這個特性,我們也可以解決這個問題。
function foo() { if (foo.t) return foo.t; foo.t = new Date(); return foo.t;}依舊沒有解決調用時都必須進行一次判斷的問題。
解決四:惰性函數
不錯,惰性函數就是解決每次都要進行判斷的這個問題,解決原理很簡單,重寫函數。
var foo = function() { var t = new Date(); foo = function() { return t; }; return foo();};更多應用
DOM 事件添加中,為了兼容現代瀏覽器和 IE 瀏覽器,我們需要對瀏覽器環境進行一次判斷:
// 簡化寫法function addEvent (type, el, fn) { if (window.addEventListener) { el.addEventListener(type, fn, false); } else if(window.attachEvent){ el.attachEvent('on' + type, fn); }}問題在于我們每當使用一次 addEvent 時都會進行一次判斷。
利用惰性函數,我們可以這樣做:
function addEvent (type, el, fn) { if (window.addEventListener) { addEvent = function (type, el, fn) { el.addEventListener(type, fn, false); } } else if(window.attachEvent){ addEvent = function (type, el, fn) { el.attachEvent('on' + type, fn); } }}當然我們也可以使用閉包的形式:
var addEvent = (function(){ if (window.addEventListener) { return function (type, el, fn) { el.addEventListener(type, fn, false); } } else if(window.attachEvent){ return function (type, el, fn) { el.attachEvent('on' + type, fn); } }})();當我們每次都需要進行條件判斷,其實只需要判斷一次,接下來的使用方式都不會發生改變的時候,想想是否可以考慮使用惰性函數。
重要參考
Lazy Function Definition Pattern
總結
以上就是這篇文章的全部內容了,希望本文的內容對大家的學習或者工作能帶來一定的幫助,如果有疑問大家可以留言交流,謝謝大家對武林網的支持。
新聞熱點
疑難解答