摘要:一個對象維持一系列依賴于它觀察者的對象,將有關(guān)狀態(tài)的任何變更自動通知給它們。觀察者模式的實現(xiàn)模擬擁有的一系列依賴使用擴展對象模擬目標(biāo)和在觀察者列表上添加刪除或通知觀察者
1. 觀察者模式的實現(xiàn)一個對象(subject)維持一系列依賴于它(觀察者)的對象,將有關(guān)狀態(tài)的任何變更自動通知給它們。
當(dāng)一個目標(biāo)需要告訴觀察者發(fā)生了什么有趣的事情,它會向觀察者廣播一個通知
當(dāng)我們不再希望某個特定的觀察者獲取其注冊目標(biāo)發(fā)出的改變通知時,該目標(biāo)可以將它從觀察者列表中刪除。
Observer(觀察者)模式列表組件
Subject(目標(biāo)): 維護一系列觀察者,方便添加或刪除觀察者
Observer(觀察者): 為那些在目標(biāo)狀態(tài)發(fā)生改變時需獲得通知的對象提供一個更新接口
ConcreteSubject(具體目標(biāo)):狀態(tài)發(fā)生改變時,向Observer發(fā)出通知,存儲ConcreteObserver的狀態(tài)
ConcreteObserver(具體觀察者):存儲一個指向ConcreteSubject的更新接口,實現(xiàn)Observer的更新接口,以使自身狀態(tài)與目標(biāo)的狀態(tài)保持一致。
1.1 模擬擁有的一系列依賴Observer
function ObserverList(){ this.observerList = []; } ObserverList.prototype.Add = function(obj){ return this.observerList.push(obj); }; ObserverList.prototype.Remove = function(obj){ return this.observerList.pop(obj); }; ObserverList.prototype.Empty = function(){ this.observerList = []; }; ObserverList.prototype.Count = function(){ return this.observerList.length; }; ObserverList.prototype.Get = function(index){ if(index > -1 && index < this.observerList.length){ return this.observerList[index]; } }; ObserverList.prototype.Insert = function(obj,index){ var pointer = -1; if(index === 0){ this.observerList.unshift(obj); pointer = index; }else if(index === this.observerList.length){ this.observerList.push(obj); pointer = index; } return pointer; }; ObserverList.prototype.IndexOf = function(obj,startIndex){ var i = startIndex, pointer = -1; while(i < this.observerList.length){ if(this.observerList[i] === obj){ pointer = i; } i++; } return pointer; }; ObserverList.prototype.RemoveIndexAt = function(index){ if(index === 0){ this.observerList.shift(); }else if(index === this.observerList.length - 1){ this.observerList.pop(); } }; //使用extension擴展對象 function extend(obj,extension){ for(var key in obj){ extension[key] = obj[key]; } }; var liuyidi = {}; var observer = new ObserverList(); extend(observer,liuyidi); console.log(liuyidi);
1.2 模擬目標(biāo)(Subject)和在觀察者列表上添加、刪除或通知觀察者
function Subject(){ this.observers = new ObserverList(); } Subject.prototype.AddObserver = function(observer){ this.observers.Add(observer); }; Subject.prototype.RemoveObserver = function(observer){ this.observers.RemoveIndexAt(this.observers.IndexOf(observer,0)); }; Subject.prototype.Notify = function(context){ var observerCount = this.observers.Count(); for(var i = 0; i < observerCount; i++){ this.observers.Get(i).Update(context); } };
文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址:http://systransis.cn/yun/78880.html
摘要:推文用設(shè)計模式解構(gòu)三國是一種什么體驗行為型設(shè)計模式一策略模式工廠模式優(yōu)化結(jié)構(gòu)狀態(tài)模式隨著狀態(tài)改變而改變行為。推文狀態(tài)機與狀態(tài)模式責(zé)任鏈模式多個對象依次處理請求前者指定后者。代理模式代理針對一個對象,為了增加控制等中介雙方都是多個,為了解耦。 策略模式 選擇使用封裝好的一系列算法,可相互替換。 類比:商店[Context]買完衣服買單[Stratege](現(xiàn)金[Concrete Stra...
摘要:先實現(xiàn)一個簡單的數(shù)據(jù)劫持。思路遍歷對象的每個屬性,為每個屬性掛上監(jiān)聽函數(shù)即利用進行元編程考慮屬性的子屬性的監(jiān)聽先上代碼你訪問了你設(shè)置了新的其中涉及的知識點如果屬性值還是對象,則遞歸繼續(xù) 先實現(xiàn)一個簡單的數(shù)據(jù)劫持。思路: 遍歷對象的每個屬性,為每個屬性掛上監(jiān)聽函數(shù)(即利用Object.defineProperty進行元編程); 考慮屬性的子屬性的監(jiān)聽;先上代碼: function ...
摘要:觀察者模式是一種使用頻率非常高的設(shè)計模式,無論是移動應(yīng)用應(yīng)用或者桌面應(yīng)用,觀察者模式幾乎無處不在,它為實現(xiàn)對象之間的聯(lián)動提供了一套完整的解決方案,凡是涉及到一對一或者一對多的對象交互場景都可以使用觀察者模式。 觀察者模式(Observer Pattern)屬于對象行為型模式的一種,定義對象之間的一種一對多依賴關(guān)系,使得每當(dāng)一個對象狀態(tài)發(fā)生改變時,其相關(guān)依賴對象皆得到通知并被自動更新。 ...
摘要:抽象模式使用的裝飾者模式允許我們在運行時或者在隨后一個點上動態(tài)地將兩個或兩個以上的對象和它們的屬性一起擴展或合并為一個單一對象。定義三個對象目的是為了裝飾對象將的額外功能附加到上。 抽象decorator模式 使用jQuery的裝飾者模式 jQuery.extend()允許我們在運行時或者在隨后一個點上動態(tài)地將兩個或兩個以上的對象(和它們的屬性)一起擴展(或合并)為一個單一對象。 定義...
摘要:實現(xiàn)模塊的幾種方法對象字面量表示法模式模式模式模塊對象字面量對象字面量型完整版配置對象基本方法根據(jù)配置信息輸出內(nèi)容重寫當(dāng)前的配置信息輸出結(jié)果值模式最初被定義為一種在傳統(tǒng)軟件工程中為類提供私有和公有封裝的方法。該模式返回一個對象。 javascript實現(xiàn)模塊的幾種方法: 對象字面量表示法 Module模式 AMD模式 CommonJS模式 ECMAScript Harmony模塊 ...
閱讀 1642·2021-10-14 09:43
閱讀 5592·2021-09-07 10:21
閱讀 1293·2019-08-30 15:56
閱讀 2143·2019-08-30 15:53
閱讀 1246·2019-08-30 15:44
閱讀 2024·2019-08-30 15:44
閱讀 1336·2019-08-29 17:24
閱讀 767·2019-08-29 15:19