设计模式（惰性模块）

Posted 2020-08-09 hsp大鹏

   惰性模式：减少每次代码 执行时重复的分支判断，通过对对象重新定义屏蔽原对象中的分支判断。

   浏览器兼容算是比较头疼的问题，大家都会遇到某些属性浏览器支持，有些不支持；就像早期的ie不支持addEventListener一样，每次需要针对ie写不同的代码判断去兼容。惰性模式就是为了减少每次重复判断。

   惰性模式两种定义方式：

   第一种：在文件加载初始化时候：(这是一种闭包方式，在初始化时候进行支持性判断后，重新定义)

 1             addevent = function(ele,type,fn) {
 2                 if(document.addEventListener) {
 3                     return function(ele, type, fn) {
 4                         ele.addEventListener(type, fn, false)
 5                     }
 6                 } else if(document.attachEvent) {
 7                     return function(ele, type, fn) {
 8                         ele.attachEvent("on" + type, fn);
 9                     }
10                 } else {
11                     return function(ele, type, fn) {
12                         ele["on" + type] = fn;
13                     }
14                 }
15             }();

    第二种：在第一次调用定义的方法时候，重新定义

    

 1             onevent = function(ele, type, fn) {
 2                 if(document.addEventListener) {
 3                     onevent = function(ele, type, fn) {
 4                         ele.addEventListener(type, fn, false)
 5                     }
 6                 } else if(document.attachEvent) {
 7                     onevent = function(ele, type, fn) {
 8                         ele.attachEvent("on" + type, fn);
 9                     };
10                 } else {
11                     onevent = function(ele, type, fn) {
12                         ele["on" + type] = fn;
13                     }
14                 }
15                 onevent(ele, type, fn)
16             }

     上述两种方法是为了减少每次在调用方法时候，重复性的判断。两种方法的区别：第一种：在加载初始化时候可能占资源，第二种：在第一次调用时候，需要重新定义，然后在方法最后需要自己再调用下新方法。两种方法可根据自己需要进行选择。