美文网首页
设计模式(六)-外观模式(门面模式)

设计模式(六)-外观模式(门面模式)

作者: 仔崽06 | 来源:发表于2021-01-28 17:00 被阅读0次
外观模式

隐藏系统的复杂性,并向客户端提供了一个客户端可以访问系统的接口,这种类型的设计模式属于结构型模式,它向现有的系统添加一个接口,来隐藏系统的复杂性.

  • 图例


    image.png
  • 代码实现
class Chips{
    create(){
        return console.log('薯条')
    }
}
class Hamburg{
    create(){
        return console.log('汉堡包')
    }
}
class Coke{
    create(){
        return console.log('可乐')
    }
}

class Somecounter{
   constructor(){
       this.chips=new Chips()
       this.hamburg=new Hamburg()
       this.coke=new Coke()
   }
   make(){
      this.chips.create()
      this.hamburg.create()
      this.coke.create()
   }
}

class Client{
   constructor(){
     this.somecounter=new Somecounter();
   }
   order(){
      return this.somecounter.make()
   }
}

let client=new Client()
client.order() //薯条  汉堡包 可乐 

  • 应用场景
function ajax(type, url, callback, data) {
    // 根据当前浏览器获取对ajax连接对象的引用
    var xhr = (function () {
            try {
                // 所有现代浏览器所使用的标准方法
                return new XMLHttpRequest();
            } catch (e) {}
            // 较老版本的internet Explorer兼容
            try {
                return new ActiveXObject("Msxml2.XMLHTTP.6.0");
            } catch (e) {}
            try {
                return new ActiveXObject("Msxml2.XMLHTTP.3.0");
            } catch (e) {}
            try {
                return new ActiveXObject("Microsoft.XMLHTTP");
            } catch (e) {}
            // 如果没能找到相关的ajax连接对象,则跑出一个错误。
            throw new Error("Ajax not support in this browser.")
        }())
        STATE_LOADED = 4,
        STATUS_OK = 200;
       // 一但从服务器收到表示成功的相应消息,则执行所给定的回调方法
    xhr.onreadystatechange = function (){
        if (xhr.readyState !== STATE_LOADED) {
            return;
        }
        if (xhr.state == STATUS_OK) {
            callback(xhr.responseText);
        }
    }

    // 使用浏览器的ajax连接对象来向所给定的URL发出相关的调用
    xhr.open(type.toUpperCase(), url);
    xhr.send(data);
}
// 使用方法
ajax("get", "/user/12345", function (rs) {
    alert('收到的数据为:' + rs);
})
优点
1.实现了子系统与客户端之间松耦合的关系.
2.客户端屏蔽了子系统组件,减少了客户端所处理的对象数目,并使得子系统使用起来更加容易.

相关文章

  • 外观模式(Facede)

    本文参考自: 《JAVA设计模式》之外观模式(Facade) 1. 作用 外观模式也叫门面模式,门面模式是对象的结...

  • 设计模式(六)-外观模式(门面模式)

    外观模式 隐藏系统的复杂性,并向客户端提供了一个客户端可以访问系统的接口,这种类型的设计模式属于结构型模式,它向现...

  • 设计模式[9]-外观模式-Facade Pattern

    1. 外观模式 外观模式(Facade Pattern),又称为门面模式,是非常常用的结构性设计模式。外观模式使得...

  • 设计模式——门面模式(外观模式)

    《Head First 设计模式》《设计模式之禅(第二版)》 学习笔记,码云同步更新中如有错误或不足之处,请一定指...

  • 设计模式详解——外观模式

    本篇文章介绍一种设计模式——外观模式。本篇文章内容参考《JAVA与模式》之门面模式,外观模式,深入浅出外观模式(二...

  • 学好设计模式防被祭天:门面模式

    为了防止被“杀”了祭天,学点设计模式,并总结下还是有必要的。 一:理解 门面模式也称为外观模式。 门面模式提供了一...

  • 设计模式之外观模式(门面模式)

    一个栗子:身为一个程序猿,连续加班25天,在打了25个喷嚏之后,你终于意识到自己感冒了,为了能够省下钱买阿珂288...

  • S13. 外观模式

    外观模式 外观模式又叫门面模式,是一种结构型设计模式, 能为程序库、 框架或其他复杂类提供一个简单的接口。 外观模...

  • 设计模式(九):门面/外观模式

    门面模式(Facade)又称外观模式 为客户端提供了一个客户端可以访问系统的接口。降低访问复杂系统的内部子系统时的...

  • java设计模式 - 外观(门面)模式

    1.结构与实现 主要是定义了一个高层接口。它包含了对各个子系统的引用,客户端可以通过它访问各个子系统的功能。现在来...

网友评论

      本文标题:设计模式(六)-外观模式(门面模式)

      本文链接:https://www.haomeiwen.com/subject/gstxtltx.html