你的位置:首页 > Java教程

[Java教程]JS编程模式之初始化分支与惰性初始


不同的浏览器对于相同或相似的方法可能有不同的实现。这时,您需要依据当前的浏览器的支持方法来选择对应的执行分支。这类分支有可能与很多,因此可能会减缓脚本的执行速度。但非要等到运行时才能分支吗?我们完全可以在加载脚本时,在模块初始化的过程中就将部分代码进行分支处理。这显然更有利于提高效率。利用Javascript代码可以动态定义的特性,我们可以为不同的浏览器定制不同的实现方法,下面我们以定义事件处理程序举例:

初始化分支:

var MYAPP = {};  MYAPP.event = {    addListener: null,  //事后可能会被赋值为对象或函数的变量,都应该初始为null    removeListener: null  };
   //当脚本执行时,我们主动去执行分支,而不是等到用到事件处理时候 if (window.addEventListener) {  //支持addEventListener的浏览器 MYAPP.event.addListener = function (el, type, fn) { el.addEventListener(type, fn, false); }; MYAPP.event.removeListener = function (el, type, fn) { el.removeEventListener(type, fn, false); }; } else if (document.attachEvent) {  //IE MYAPP.event.addListener = function (el, type, fn) { el.attachEvent("on"+type, fn); }; MYAPP.event.removeListener = function (el, type, fn) { el.detachEvent("on"+type, fn); }; } else {  //older browsers MYAPP.event.addListener = function (el, type, fn) { el["on"+type]=fn; }; MYAPP.event.removeListener = function (el, type, fn) { el["on"+type]=null; }; }

 

惰性初始:

惰性初始模式与上面的初始化分支模式很相似。不同之处在于,该模式下的分支只有在相关函数第一次被调用时才会发生-----即只有函数被调用时,它才会以最佳实现改写自己。

var MYAPP = {};  MYAPP.event = {    addListener: function (el, type, fn) {
       //无论触发哪个条件,都会重写MYAPP.event.addListener方法 if (el.addEventListener) { MYAPP.event.addListener = function (el, type, fn) { el.addEventListener(type, fn, false); }; } else if (el.attachEvent) { MYAPP.event.addListener = function (el, type, fn) { el.attachEvent("on"+type, fn); }; } else { MYAPP.event.addListener = function (el, type, fn) { el["on"+type]=fn; }; }
       //注意,前面只是在第一次调用函数时,函数被重写了,注意“调用”二字,但是目前为止我们还没执行函数,所以最后要执行以下 MYAPP.event.addListener(el, type, fn); } };