访问者模式

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

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

设计模式

全部评论

相关推荐

11-24 00:11
已编辑
广东工业大学 算法工程师
避雷深圳  yidao,试用期 6 个月。好嘛,试用期还没结束,就直接告诉你尽快找下一家吧,我谢谢您嘞
牛客75408465号:笑死,直属领导和 hr 口径都没统一,各自说了一些离谱的被裁理由,你们能不能认真一点呀,哈哈哈哈哈😅😅😅
点赞 评论 收藏
分享
评论
点赞
收藏
分享
牛客网
牛客企业服务