国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

javascript - 發布-觀察者模式的小案例

xuxueli / 1879人閱讀

摘要：今天我們討論的是發布觀察者模式，也叫訂閱模式，在里，該模式要如何實現呢，首先我們先看一個現實生活中的例子小明在工作幾年后，準備買房結婚，于是他到售樓處，找售樓人員詢問當前的價格，得知售樓價每平是小明好幾個月工資的時候，小明猶豫了，于是他回

今天我們討論的是發布-觀察者模式，也叫訂閱模式，在javascript里，該模式要如何實現呢，首先我們先看一個現實生活中的例子

小明在工作幾年后，準備買房結婚，于是他到售樓處，找售樓人員詢問當前的價格，得知售樓價每平是小明好幾個月工資的時候，小明猶豫了，于是他回去后，每天都給售樓處打電話，詢問售樓人員的價格，售樓人員也會耐心解答，但是第二天又來了一個小芳，于是小芳每天也在打電話，時間久了，人越來越多，售樓人員每天接這么多電話，肯定吃不消要跳槽，當然我們只是舉例子，現實情況是，售樓人員會留下小明，小芳等等人的電話存在花名冊里，這就是訂閱，然后等房價降下來的時候，售樓人員一個個打電話通知他們，這樣雙方都省了力氣，訂閱消息的人也拿到了應得的消息。現在假設花名冊是 clientList , 售樓處是salePart，以此我們寫一個簡單發布-觀察者模式的代碼

var salePart = {}  // 售樓處
  var clientList = []  // 花名冊

  var xiaoming = {
    name: "小明",
    fn: function () {
      var args = [].slice.call(arguments)
      args.unshift(this.name)
      console.log(args.join(","))
    }
  }

  salePart.listen = function (person) {  // 售樓處登記來訪者的信息
    clientList.push(person)
  }

  salePart.trigger = function (type, price) {  // 售樓處通知來訪者信息，type為售房面積，price為售房價格
    if (clientList.length > 0) {
      for (var i = 0, person; person = clientList[i++];) {
        if (typeof person.fn === "function") {
          person.fn(type, price)
        }
      }
    }
  }

  salePart.listen(xiaoming)
  salePart.trigger("square80", 60000)  // 打印出來  小明,square80,60000

下面小芳也要來看房，可是小芳比小明有錢的多，她要看的是200平米的房子，這樣把小芳在添加進去的時候，售樓處就不能按照分類來進行通知他們的，200平米的房子的通知小明也能看到，這樣小明會更扎心，萬一不開心，就會損失一個潛在客戶，所以我們還要完善一下上述代碼，讓售樓處可以按照房屋面積分別通知對應的買房者

 var salePart = {}  // 售樓處
  var clientList = {}  // 花名冊

  var xiaoming = {
    name: "小明",
    type: "s80",
    fn: function () {
      var args = [].slice.call(arguments)
      args.unshift(this.name)
      console.log(args.join(","))
    }
  }

  var xiaofang = {
    name: "小芳",
    type: "s200",
    fn: function () {
      var args = [].slice.call(arguments)
      args.unshift(this.name)
      console.log(args.join(","))
    }
  }

  salePart.listen = function (person) {  // 售樓處登記來訪者的信息
    var type = person.type
    if (!clientList[type] || clientList[type].length < 0) {  // 原來的花名冊先分類，然后再存入每個人的信息
      clientList[type] = []
    }
    clientList[type].push(person)
  }

  salePart.trigger = function (type, price) {  // 售樓處通知來訪者信息，type為售房類型，price為售房價格
    if (clientList[type] && clientList[type].length > 0) {
      for (var i = 0, person; person = clientList[type][i++];) {
        if (typeof person.fn === "function") {
          person.fn(type, price)
        }
      }
    }
  }

  salePart.listen(xiaoming)
  salePart.listen(xiaofang)

  salePart.trigger("s80", 60000)  // 打印出來  小明,square80,60000
  salePart.trigger("s200", 200000)  // 打印出來  小芳,square200,200000

可以看到，小明只能接收到80平米的房價信息，小芳呢，也只能看到200平米的房價信息，這樣售樓處又回到了一片欣欣向榮的社會主義和諧景象，但是在實際開發中，上面的代碼并不利于維護，因為很松散，我們可以用對象的方式來把代碼重構一下

var SalePart = function () {
    this.clientList = {}
  }

  SalePart.prototype.listen = function () {  // 現在我們把該函數處理為可以一次接收多個來訪者
    var persons = [].slice.call(arguments)

    for (var i = 0, p; p = persons[i++];) {
      var type = p.type
      if (!this.clientList[type] || this.clientList[type].length < 0) {
        this.clientList[type] = []
      }
      this.clientList[type].push(p)
    }
  }

  SalePart.prototype.trigger = function (type, price) {
    if (this.clientList[type] && this.clientList[type].length > 0) {
      for (var i = 0, p; p = this.clientList[type][i++];) {
        if (typeof p.fn === "function") {
          p.fn(type, price)
        }
      }
    }
  }

  var salePart = new SalePart()
  salePart.listen(xiaoming, xiaofang)
  salePart.trigger("s80", 50000)  // 小明,s80,50000 感謝黨和國家房價終于降了！
  salePart.trigger("s200", 100000)  // 小芳,s200,100000  這么便宜，買買買！！！

以上就是本章的內容，結合實際案例希望大家看起來更好理解一些，如有疑問，可以在下方留言，看到后我會盡快回復。

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/93586.html

相關文章

  • 觀察者模式的使用介紹

    摘要：觀察者模式介紹觀察者模式又稱發布訂閱模式，它定義對象間的一種一對多的依賴關系，當一個對象發生改變的時候，所依賴它的對象都能得到通知。關于內部的觀察者模式可以參數這篇文檔。總結總之，觀察者模式在中的使用是非常廣泛的。 javascript觀察者模式 介紹 觀察者模式又稱發布-訂閱模式，它定義對象間的一種一對多的依賴關系，當一個對象發生改變的時候，所依賴它的對象都能得到通知。例如：我們訂閱...

    ityouknow 評論0 收藏0

  • 前端知識點

    摘要：原理對處理函數進行延時操作，若設定的延時到來之前，再次觸發事件，則清除上一次的延時操作定時器，重新定時。在目標發出內容改變的事件后，直接接收事件并作出響應。首先是目標的構造函數，他有個數組，用于添加觀察者。 關于排序 js中sort函數的底層實現機制？ js中sort內置多種排序算法，是根據要排序數的亂序程度來決定使用哪一種排序方法。V8 引擎 sort 函數只給出了兩種排序 Inse...

    wums 評論0 收藏0

  • 《JavaScript 模式》知識點小抄本（下）

    摘要：缺點不符合開閉原則，如果要改東西很麻煩，繼承重寫都不合適。預防低水平人員帶來的風險。開閉原則，高拓展性。這里的訂閱者稱為觀察者，而被觀察者稱為發布者，當一個事件發生，發布者會發布通知所有訂閱者，并常常以事件對象形式傳遞消息。 介紹 最近開始給自己每周訂個學習任務，學習結果反饋為一篇文章的輸出，做好學習記錄。 這一周(02.25-03.03)我定的目標是《JavaScript 模式》...

    xiguadada 評論0 收藏0

  • JavaScript 中常見設計模式整理

    摘要：開發中，我們或多或少地接觸了設計模式，但是很多時候不知道自己使用了哪種設計模式或者說該使用何種設計模式。本文意在梳理常見設計模式的特點，從而對它們有比較清晰的認知。 showImg(https://segmentfault.com/img/remote/1460000014919705?w=640&h=280); 開發中，我們或多或少地接觸了設計模式，但是很多時候不知道自己使用了哪種設...

    Nosee 評論0 收藏0

  • javascript設計模式學習筆記之發布-訂閱模式

    摘要：發布訂閱模式定義對象間的一種一對多的依賴關系當一個對象的狀態發生改變時所有依賴于它的對象都將得到通知簡單實現定義發布者緩存列表存放訂閱者的回調函數定義訂閱者發布消息測試訂閱者價格訂閱者價格發布消息上面的實現方式導致了每個訂閱者都會收到發布 發布-訂閱模式 定義對象間的一種 一對多 的依賴關系, 當一個對象的狀態發生改變時, 所有依賴于它的對象都將得到通知 簡單實現 // 定...

    klivitamJ 評論0 收藏0

發表評論

0條評論

xuxueli

男|高級講師

TA的文章

閱讀更多
最新活動
閱讀需要支付1元查看
<