欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

JavaScript門面模式詳解

 更新時間:2017年10月19日 16:36:23   作者:與你在巔峰相會  
這篇文章主要為大家詳細介紹了JavaScript門面模式的相關資料,具有一定的參考價值,感興趣的小伙伴們可以參考一下

外部與一個子系統(tǒng)的通信必須通過一個系統(tǒng)的一個門面對象進行,這就是門面模式。

門面模式具備如下兩個角色:

1. 門面角色

客戶端可以調(diào)用這個角色方法,此角色中有子系統(tǒng)的應用(知曉相關的(一個或多個)子系統(tǒng)的功能和責任)。本角色會將所有從客戶端發(fā)來的請求委派到相應的子系統(tǒng)去。

2. 子系統(tǒng)角色

可以同時有一個或多個子系統(tǒng)。每一個子系統(tǒng)都不是一個單獨的類,而是一些類的集合。每一個子系統(tǒng)都可以被客戶端直接調(diào)用(這樣客戶端代碼會多),或被門面角色調(diào)用。子系統(tǒng)并不知道門面的存在,對于子系統(tǒng)而言,門面僅僅是另一個客戶端而已。

 下面我們來看一個可以提現(xiàn)門面模式的簡單需求:主人為自己的寵物狗辦理的相應的寵物領養(yǎng)證件

從這個簡單的需求中我們可以大致分析出我們需要:主人Person類和寵物狗Dog類 的一些相關信息

在下面的例子中國會涉及到接口的驗證,現(xiàn)在先將代碼貼出來

//(定義一個靜態(tài)方法來實現(xiàn)接口與實現(xiàn)類的直接檢驗
//靜態(tài)方法不要寫出Interface.prototype ,因為這是寫到接口的原型鏈上的
//我們要把靜態(tài)的函數(shù)直接寫到類層次上
//定義一個接口類
var Interface=function (name,methods) {//name:接口名字
  if(arguments.length<2){
    alert("必須是兩個參數(shù)")
  }
  this.name=name;
  this.methods=[];//定義一個空數(shù)組裝載函數(shù)名
  for(var i=0;i<methods.length;i++){
    if(typeof methods[i]!="string"){
      alert("函數(shù)名必須是字符串類型");
    }else {
      this.methods.push( methods[i]);
    }
  }
};
Interface.ensureImplement=function (object) {
  if(arguments.length<2){
    throw new Error("參數(shù)必須不少于2個")
    return false;
  }
  for(var i=1;i<arguments.length;i++){
    var inter=arguments[i];
    //如果是接口就必須是Interface類型
    if(inter.constructor!=Interface){
      throw new Error("如果是接口類的話,就必須是Interface類型");
    }
    //判斷接口中的方法是否全部實現(xiàn)
    //遍歷函數(shù)集合
    for(var j=0;j<inter.methods.length;j++){
      var method=inter.methods[j];//接口中所有函數(shù)

      //object[method]傳入的函數(shù)
      //最終是判斷傳入的函數(shù)是否與接口中所用函數(shù)匹配
      if(!object[method]||typeof object[method]!="function" ){
      //實現(xiàn)類中必須有方法名字與接口中所用方法名相同
        throw new Error("實現(xiàn)類中沒有完全實現(xiàn)接口中的所有方法")
      }
    }
  }
}

(1)主人類(Person類)

  function Person() {
   this.name="測試";
   this.address="居住在中國";
   this.getInfo=function () {
     return "名字"+this.name+" 地址"+this.address;
   };
   this.learn=function () {
     alert("學習的方法");
   }
    this.marray=function () {
      alert("marray");
    }
   //驗證接口
    Interface.ensureImplement(this,PersonDao);//驗證該類是否全部實現(xiàn)接口中的方法
  }

(2)寵物狗(Dog類)

var DogDao=new Interface("DogDao",["getInfo","call","run"]);

  var Dog=function () {
    this.name="gg";
 this.getInfo=function () {
   return "狗狗的名字"+this.name;
 };
 this.call=function () { };
 this.run=function () {};
 Interface.ensureImplement(this,DogDao);//驗證接口
  }

(3)現(xiàn)在可以主人可以給自己的寵物狗辦理寵物領養(yǎng)證件了   -----客戶端代碼

 第一種方法:不用門面的方式客戶端的代碼如下

function action(person,dog) {
  var r="GG"+new Date().getDay()+Math.floor(Math.random()*11);
  var str="辦證成功:編號"+r
   +"<br/>主人信息"+person.getInfo()
  +"<br>狗狗的信息:"+dog.getInfo();
  return str;
}document.write(action(new Person(),new Dog()));

第二種方法:使用門面模式-----將復雜的事交給門面來做,客戶端壓力可以減小

  #1:門面中進行如下的處理

 function facade(person,dog) {
   var r="GG"+new Date().getDay()+Math.floor(Math.random()*11);
   var str="辦證成功:編號"+r
     +"<br/>主人信息"+person.getInfo()
     +"<br>狗狗的信息:"+dog.getInfo();
   this.action=function () {//相當于實例的方法
     return str;
   };
 }

#2:客戶端負責使用的代碼為

function action2(person,dog) {
   document.write(new facade(person,dog).action());
}
action2(new Person(),new Dog());

總結,我們可以看出不適用門面模式的客戶端需要處理較為復雜的業(yè)務,使用門面后,在門面中處理復雜的東西,而客戶端只需要簡單的調(diào)用即可。

 一個簡單理解門面模式的圖結構:

以上就是本文的全部內(nèi)容,希望對大家的學習有所幫助,也希望大家多多支持腳本之家。

相關文章

  • 基于JavaScript實現(xiàn)一個簡單的事件觸發(fā)器

    基于JavaScript實現(xiàn)一個簡單的事件觸發(fā)器

    這篇文章主要為大家詳細介紹了如何使用JavaScript實現(xiàn)一個簡單的事件觸發(fā)器,文中的示例代碼講解詳細,感興趣的小伙伴可以跟隨小編一起學習一下
    2024-01-01
  • JS實現(xiàn)iframe自適應高度的方法示例

    JS實現(xiàn)iframe自適應高度的方法示例

    這篇文章主要介紹了JS實現(xiàn)iframe自適應高度的方法,結合實例形式分析了JS實現(xiàn)iframe高度自適應的實現(xiàn)技巧,并給出了項目示例供大家參考,需要的朋友可以參考下
    2017-01-01
  • JS基于onclick事件實現(xiàn)單個按鈕的編輯與保存功能示例

    JS基于onclick事件實現(xiàn)單個按鈕的編輯與保存功能示例

    這篇文章主要介紹了JS基于onclick事件實現(xiàn)單個按鈕的編輯與保存功能,結合實例形式分析了JS實現(xiàn)onclick響應事件的轉(zhuǎn)換相關操作技巧,具有一定參考借鑒價值,需要的朋友可以參考下
    2017-02-02
  • JS實現(xiàn)圖片點擊后出現(xiàn)模態(tài)框效果

    JS實現(xiàn)圖片點擊后出現(xiàn)模態(tài)框效果

    這篇文章主要介紹了JS實現(xiàn)圖片點擊后出現(xiàn)模態(tài)框效果,非常不錯,具有參考借鑒價值,需要的朋友可以參考下
    2017-05-05
  • JavaScript實現(xiàn)LRU算法的示例詳解

    JavaScript實現(xiàn)LRU算法的示例詳解

    不知道屏幕前的朋友們,有沒有和我一樣,覺得LRU算法原理很容易理解,實現(xiàn)起來卻很復雜。所以本文就為大家整理了一下實現(xiàn)的示例代碼,需要的可以參考一下
    2023-04-04
  • JS中可以改善代碼的5種重構技術分享

    JS中可以改善代碼的5種重構技術分享

    代碼重構涉及在不改變其外部功能的情況下對現(xiàn)有代碼進行改進,這是編程的核心部分之一,所以下面我們將研究一些技巧,這些技巧可以幫助我們以更好的方式重構代碼,希望對大家有所幫助
    2023-06-06
  • JS給Array添加是否包含字符串的簡單方法

    JS給Array添加是否包含字符串的簡單方法

    下面小編就為大家?guī)硪黄狫S給Array添加是否包含字符串的簡單方法。小編覺得挺不錯的,現(xiàn)在就分享給大家,也給大家做個參考。一起跟隨小編過來看看吧
    2016-10-10
  • Bootstrap警告(Alerts)的實現(xiàn)方法

    Bootstrap警告(Alerts)的實現(xiàn)方法

    這篇文章主要為大家詳細介紹了Bootstrap警告(Alerts)的實現(xiàn)方法,具有一定的參考價值,感興趣的小伙伴們可以參考一下
    2017-03-03
  • 一文讀懂微信小程序頁面導航

    一文讀懂微信小程序頁面導航

    微信小程序是一種不需要下載安裝即可使用的應用,它實現(xiàn)了應用“觸手可及”的夢想,用戶掃一掃或者搜一下即可打開應用,下面這篇文章主要給大家介紹了關于如何通過一文讀懂微信小程序頁面導航的相關資料,需要的朋友可以參考下
    2022-11-11
  • JS實現(xiàn)數(shù)組扁平化的方法分享

    JS實現(xiàn)數(shù)組扁平化的方法分享

    數(shù)組扁平化指的是:將一個多層嵌套的數(shù)組,處理成只有一層的數(shù)組。本文主要和大家介紹了幾個常用的JS數(shù)組扁平化方法,希望對大家有所幫助
    2023-04-04

最新評論