js38---门面模式

简介:
(function(){
    //门面
    function addEvebtFacade(el,type,fn){
        if(window.addEventListener){
            //使用与火狐浏览器
            alert(1);
            el.addEventListener(type,fn,false);
        }else if(window.attachEvent){
            //适用于IE的
            alert(2);
            el.attachEvent("on"+type,fn);
        }else{
            alert(3);
            el["on"+type] = fn;
        }
    }
    document.write("<a id='but1' href='#'>click</a>");
    var el = document.getElementById("but1");
    addEvebtFacade(el,"click",function(){
        alert("ok")
    })
})()
复制代码
复制代码
/**
 * 用2个DAO来体现门面模式
 */
(function(){
    //人员类
    var PersonDao = new Interface("PersonDao",["getInfo","learn",
            "marry"]);
    var Person = function(){
        this.name = "YUNFENGCHENG";
        this.address = "BEIJING";
        this.getInfo = function(){
            return "名字: "+this.name +" 地址: "+this.address;
        }
        this.learn = function(){
            document.write("学习");
        }
        this.marry = function(){};
        //验证实现的接口
        Interface.ensureImplements(this,PersonDao);
    }
    //DOG DAO
    var DogDao = new Interface("DogDao",["call","run","getInfo"]);
    var Dog = function(){
        this.name = "DAHUANG";
        this.getInfo = function(){
            return "狗狗的名字: "+this.name;
        }
        this.run = function(){};
        this.call = function(){};
        Interface.ensureImplements(this,DogDao);
    }
    //需求是现在需要给养的够办了相应宠物领养证件  需要人和狗狗的信息可以
    //1.不用门面
    //客户端程序
    function action(person,dog){
        //当做养狗证的号码
        var r = "GG"+new Date().getDate()+Math.floor(Math.random()*11);
        var str = "办证成功 :编号 "+r
        +"<br>主人信息: "+person.getInfo()
        +"<br>狗狗的信息: "+dog.getInfo();
        document.write(str);
    }
    action(new Person(),new Dog());
    document.write("<br>..........................");
    //使用门面模式
    //负载的事交给门面来做
    function facade(person,dog){
        //当做养狗证的号码
        var r = "GG"+new Date().getDate()+Math.floor(Math.random()*11);
        this.str = "办证成功 :编号 "+r
        +"<br>主人信息: "+person.getInfo()
        +"<br>狗狗的信息: "+dog.getInfo();
    }
    facade.prototype.action = function(){
        return this.str;
    }
    //客户端程序
    function action2(person,dog){
        document.write(new facade(person,dog).action());
    }
    action2(new Person(),new Dog())
    //用了门面模式客户端代码就变的如此的简单了
})()
复制代码

 


本文转自农夫山泉别墅博客园博客,原文链接:http://www.cnblogs.com/yaowen/p/6892227.html,如需转载请自行联系原作者

相关文章
|
JavaScript 前端开发 API
|
4月前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp的客户关系管理系统附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的客户关系管理系统附带文章源码部署视频讲解等
86 2
|
4月前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp的医院综合管理系统附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的医院综合管理系统附带文章源码部署视频讲解等
46 5
|
4月前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp的小区物流配送系统附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的小区物流配送系统附带文章源码部署视频讲解等
109 4
|
4月前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp的宠物援助平台附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的宠物援助平台附带文章源码部署视频讲解等
78 4
|
4月前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp的宠物交易平台附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的宠物交易平台附带文章源码部署视频讲解等
70 4
|
4月前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp的大学生入伍人员管理系统附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的大学生入伍人员管理系统附带文章源码部署视频讲解等
89 4
|
4月前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp宿舍管理系统的附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp宿舍管理系统的附带文章源码部署视频讲解等
80 3
|
4月前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp的家政平台附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的家政平台附带文章源码部署视频讲解等
60 3
|
4月前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp的宠物医院系统附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的宠物医院系统附带文章源码部署视频讲解等
53 2