惰性函数

摘要：学习冴羽的博客理解惰性函数

惰性函数

惰性函数执行的分支只会在函数第一次掉用的时候执行，在第一次调用过程中，该函数会被覆盖为另一个按照合适方式执行的函数，这样任何对原函数的调用就不用再经过执行的分支了
惰性函数的关键：第一次执行后重写函数直接覆盖

应用

DOM 事件添加中，为了兼容现代浏览器和 IE 浏览器，我们需要对浏览器环境进行一次判断：

1
2
3
4
5
6
7
function addEvent(type, el, fn) {
  if (window.addEventListener) {
    el.addEventListener(type, fn, false);
  } else if (window.attachEvent) {
    el.attachEvent('on' + type, fn);
  }
}

虽然解决了兼容性问题，但是每调用一次addEvent都会进行一次判断。其实只需要判断一次我们就已经知道浏览器环境了，利用惰性函数可以只判断一次

1
2
3
4
5
6
7
8
9
10
11
12
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);
    }
  }
}

利用闭包也可以实现

1
2
3
4
5
6
7
8
9
10
11
12
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);
    }
  }
})();