JavaScript中惰性函數(shù)的示例分析
這篇文章主要介紹JavaScript中惰性函數(shù)的示例分析，文中介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們一定要看完！
創(chuàng)新互聯(lián)公司是一家專業(yè)提供北鎮(zhèn)企業(yè)網(wǎng)站建設(shè),專注與成都網(wǎng)站建設(shè)、做網(wǎng)站、H5網(wǎng)站設(shè)計、小程序制作等業(yè)務(wù)。10年已為北鎮(zhèn)眾多企業(yè)、政府機構(gòu)等服務(wù)。創(chuàng)新互聯(lián)專業(yè)網(wǎng)站建設(shè)公司優(yōu)惠進行中。
需求
我們現(xiàn)在需要寫一個 foo 函數(shù)，這個函數(shù)返回首次調(diào)用時的 Date 對象，注意是首次。
解決一：普通方法
var t;
function foo() {
if (t) return t;
t = new Date()
return t;
}問題有兩個，一是污染了全局變量，二是每次調(diào)用 foo 的時候都需要進行一次判斷。
解決二：閉包
我們很容易想到用閉包避免污染全局變量。
var foo = (function() {
var t;
return function() {
if (t) return t;
t = new Date();
return t;
}
})();然而還是沒有解決調(diào)用時都必須進行一次判斷的問題。
解決三：函數(shù)對象
函數(shù)也是一種對象，利用這個特性，我們也可以解決這個問題。
function foo() {
if (foo.t) return foo.t;
foo.t = new Date();
return foo.t;
}依舊沒有解決調(diào)用時都必須進行一次判斷的問題。
解決四：惰性函數(shù)
不錯，惰性函數(shù)就是解決每次都要進行判斷的這個問題，解決原理很簡單，重寫函數(shù)。
var foo = function() {
var t = new Date();
foo = function() {
return t;
};
return foo();
};更多應(yīng)用
DOM 事件添加中，為了兼容現(xiàn)代瀏覽器和 IE 瀏覽器，我們需要對瀏覽器環(huán)境進行一次判斷：
// 簡化寫法
function addEvent (type, el, fn) {
if (window.addEventListener) {
el.addEventListener(type, fn, false);
}
else if(window.attachEvent){
el.attachEvent('on' + type, fn);
}
}問題在于我們每當使用一次 addEvent 時都會進行一次判斷。
利用惰性函數(shù)，我們可以這樣做：
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);
}
}
})();當我們每次都需要進行條件判斷，其實只需要判斷一次，接下來的使用方式都不會發(fā)生改變的時候，想想是否可以考慮使用惰性函數(shù)。
以上是“JavaScript中惰性函數(shù)的示例分析”這篇文章的所有內(nèi)容，感謝各位的閱讀！希望分享的內(nèi)容對大家有幫助，更多相關(guān)知識，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道！
分享名稱：JavaScript中惰性函數(shù)的示例分析
網(wǎng)頁網(wǎng)址：http://m.jiaotiyi.com/article/pesgdc.html