背景
在开发过程中,有时候需要对浏览器环境进行检测,比如封装一个可以获取元素样式的函数的时候，需要写一个函数进行检测,但是常规的写法有点累赘了,会检测很多遍,但是浏览器环境是固定不变的,检测只需要检测一遍.这样就会造成每次调用这个函数的时候浏览器都会浪费太多时间去再检测一次.这时候就应该用到惰性函数来解决这个问题
惰性函数
- 针对优化频繁使用的函数
- 由于各大浏览器的差异，我们在实现一项功能的时候需要考虑不同浏览器之间的兼容性问题，因此需要进行浏览器嗅探
- 惰性载入表示函数执行的分支只会在函数第一次掉用的时候执行，在第一次调用过程中，该函数会被覆盖为另一个按照合适方式执行的函数，这样任何对原函数的调用就不用再经过执行的分支了。
实例
- 获取元素样式的有两种方式：
- getComputedStyle（[元素对象]） 不兼容ie6-8
- [元素对象].currentStyle 没有兼容问题
function get_css(element,attr){
//第一次执行函数，根据浏览器兼容情况，对外部的get_css进行重构
if('getComputedStyle' in window){
get_css=function(element,attr){
return window.getComputedStyle(element)[attr]
}
}
else{
get_css=function(element,attr){
return element.currentStyle[attr];
};
}
//第一次执行也需要获得结果，把重构的函数执行一次
return get_css(docment,attr)
}
var w=get_css(docment.body,'width');
//后续执行函数，执行的是第一次重构后的小方法，无需校验兼容性
var h=get_css(docment.body,'height');
get_css函数传入两个参数，一个是元素本身，一个是样式属性。当第一次执行函数，先判断getComputedStyle在不在window上，如果不在，那就说明当前环境是ie6-8。如果此函数在项目中大量被使用，每次都不做这样判断，而执行整个函数，这样会消耗性能。此时，惰性函数的使用就显得尤为重要了，第一次判断了当前浏览器的环境，以后再调用此函数的时候，就不用判断了，对函数进行重构，使其性能得到了优化。
