访问者模式(Vistor):针对于对象结构中的元素,定义在不改变该对象的前提下访问结构中元素的新方法。
例如IE中的attachEvent中的this指向的不知当前这个元素而是window对象,所以可以使用call或者apply方法来改变函数执行时的作用域,让某个对象在其他作用域中执行。
function bindIEEvent(dom,type,fn,data){ var data = data || {}; dom.attachEvent('on'+type,function(e){ fn.call(dom,e,data) }); }
将事件源元素对象在事件回调函数作用域中执行,所以回调函数中的this就指代的是事件源元素对象了。
创建一个访问器,将必要的方法封装在内部,使用和管理起来会更加方便
var Visitor = (function(){ return { //截取方法 slice:function(){ //splice方法参数,从原参数的第二个参数算起 var args = Array.prototype.splice.call(arguments,1); //对第一个参数对象执行splice方法 return Array.prototype.splice.apply(arguments[0],args); }, //追加数据方法 push:function(){ //强化类数组对象,是他拥有length属性 var len = arguments[0].length || 0; //添加的数据从原参数的第二个参数算起 var args = this.splice(arguments,1); //校正length属性 arguments[0].length = len + arguments.length - 1; //对第一个参数对象执行push方法 return Array.prototype.push.apply(arguments[0],args); }, //弹出最后一次添加的元素 pop:function(){ //对第一个参数对象执行pop方法 return Array.prototype.pop.apply(arguments[0]); } } })();
对象访问器添加了三个数组方法,使用的数组对象的原生方法的访问来实现,有了这个就可以像数组一样操作一个对象了。
var a = new Object(); console.log(a.length) //undefined Vistor.push(a,1,2,3,4) console.log(a.length) // 4 Vistor.push(a,4,5,6) console.log(a) //Object {0:1,1:2,2:3,3:4,4:4,5:5,6:6,length:7}
创建a对象是没有length属性的,但是调用了push方法就拥有了length属性。