访问者模式

访问者模式(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属性。

设计模式 文章被收录于专栏

设计模式

全部评论

相关推荐

喜欢吃蛋糕仰泳鲈鱼是我的神:字节可以找个hr 给你挂了,再放池子捞
点赞 评论 收藏
分享
11-30 11:07
河南大学 Java
宇宙厂 测开 n*15
丘丘给个offer:有后选后
点赞 评论 收藏
分享
评论
点赞
收藏
分享
牛客网
牛客企业服务