惰性函数

定义:惰性载入表示函数执行的分支只会在函数第一次掉用的时候执行,在第一次调用过程中,该函数会被覆盖为另一个按照合适方式执行的函数,这样任何对原函数的调用就不用再经过执行的分支了。

上面一坨可能看起来不那么优雅 下面我们直接亮代码

我们就以一个简单的需求来介绍惰性函数吧
需求:函数返回第一次调用的时间戳 之后不管执行多少次 函数返回的都是第一次调用的时间戳
var t =  null;
function firstTime() {
	if (t) {
		return t;
	}
	t = new Date().getTime();
	return t;
}
上面代码会污染到全局变量 所以我们改进一下
var firstTime = (function () {
    var t = null;
    return function () {
        if (t) {
            return t;
        }
        t = new Date().getTime();
        return t;
    }
})()
这样我们就实现了我们的需求 但是我们会发现 我们在第一次调用firstTime函数之后就已经得到了t 
按理来说我们在下一次调用函数时直接返回这个t就可以了 但是我们回看我们的代码 发现每次都需要加一次判断
这样就导致了判断代码的冗余 而惰性函数就是为了解决这个问题
现在你可以再回去试着理解一下顶部的加粗字体

当你对惰性函数定义有了一定理解后 我们现在再来看惰性函数的实现
还是使用上面的需求
function firstTime() {
	var t = new Date().getTime();
	firstTime = function () {
		return t;
	}
	return t;
}
现在你可以再回去看一下顶部的惰性函数的定义 我相信你对惰性函数会有更深的理解

概念问题解决了 下面我们来看下实际开发的应用
我们知道不同浏览器存在js兼容问题 就拿事件绑定来说 ie和w3c就有着不同的实现 而我们在实际开发往往会封装一个通用的api用来注册事件
function addEvent(dom, type, handler) {
	if (dom.addEventListener) {
		dom.addEventListener(type, handler, false);
	}else {
		dom.attachEvent('on' + type, handler);
	}
}
上面代码我们明显可以发现一个性能问题 我们在第一次绑定事件之后就已经知道了浏览器的环境 就不需要在判断浏览器环境了 而我们的代码并非如此
下面我们使用惰性函数对其进行优化
function addEvent(dom, type, handler) {
	if (dom.addEventListener) {
		dom.addEventListener(type, handler, false);
		addEvent = function () {
			dom.addEventListener(type, handler, false);
		}
	}else {
		dom.attachEvent('on' + type, handler);
		addEvent = function () {
			dom.attachEvent('on' + type, handler);
		}
	}
}
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值