實現觀察者模式－observer

lei___ 發布于2019-08-23 16:45 / 903人閱讀

摘要：來源于阿賢博客觀察者模式我們在日常開發使用經常遇到一些場景需要使用到觀察者模式，比如登錄成功需要改動同步頁面多個模塊的信息，這時最佳選擇是使用觀察者模式。

來源于：阿賢博客

observer 觀察者模式

我們在日常開發使用經常遇到一些場景需要使用到觀察者模式，比如登錄成功需要改動同步頁面多個模塊的信息，這時最佳選擇是使用observer 觀察者模式。
又是一個難忘清明節，這一次在大巴上過節了，只能在大巴上寫作咯，從昨晚9點30分在廣州省汽車站出發到現在中午12點30分還未到。歷經了15個小時還未到家，不是老家路途太遙遠，而是中國人有錢的人家太多了，導致一路堵車。想必很多小伙伴都有同樣的感受吧，不過還差1個多小時就到家了。

class Apm {
    constructor(){
        //觀察者模式
        this.observer = {
            //訂閱
            addSubscriber: function (callback, opt) {
                this.subscribers[this.subscribers.length] = {
                    callback: callback,
                    opt: (opt !== "undefined") ? opt : {}
                };
            },
            //退訂
            removeSubscriber: function (callback) {
                for (var i = 0; i < this.subscribers.length; i++) {
                    if (this.subscribers[i].callback === callback) {
                        delete (this.subscribers[i]);
                    }
                }
            },
            //發布
            publish: function (what, _observer) {
                for (var i = 0; i < this.subscribers.length; i++) {
                    if (typeof this.subscribers[i].callback === "function") {
                        
                        let observer = (_observer !== "undefined") ? _observer : {};
                        // 執行注冊的各種回調
                        this.subscribers[i].callback({ret: what, opt: this.subscribers[i].opt, observer: observer});
                    }
                }
            },
            // 將對象o具有觀察者功能
            make: function (o) { 
                for (var i in this) {
                    o[i] = this[i];
                    o.subscribers = [];
                }
            }
        };
        this.observerLogin = {
            success: function (ret) {
                this.publish(ret, {type: "success"});
            },
            error: function(ret){
                this.publish(ret, {type: "error"});
            }
        };
        // 創建觀察者模式
        this.observer.make(this.observerLogin);
    }
    login() {
        fetch({}).then((res)=>{
            if(res.code == 0){
                //發布登錄成功
                this.observerLogin.success(ret);
            }else{
                //發布登錄失敗
                this.observerLogin.error (ret);
            }
            
        })
    }
}
var apm = new Apm;

//業務邏輯
var Main = {
    init: function(){
        var _ts = this;
        //監聽登錄成功時觸發數據
        apm.observerLogin.addSubscriber(function(params){
            /*params = {
                ret: ret,//接口數據
                opt: opt, //方法傳參
                observer: { //觀察者數據
                    type: "success"
                }
            };*/
        }, {_ts: _ts});
        
        /**** 觀察者模式 ****/
        var testPage = {
            comment: function (data) {
                console.log("評論功能的作者名字：" + data["name"], data["msg"]);
                // for(var key in data){
                //     console.log("key", key, data[key]);
                // }
            },
            video: function (data){
                console.log("視頻作者bid：" + data["bid"], data["msg"]);
            }
        };

        //先注冊登錄觀察
        apm.observerLogin.addSubscriber(testPage.comment);
        apm.observerLogin.removeSubscriber(testPage.video);
    }
};

來源于：阿賢博客

云服務器 GPU云服務器設計模式觀察者模式觀察者模式 php觀察者模式 ios觀察者模式

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

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

一起學設計模式 - 觀察者模式

摘要：觀察者模式是一種使用頻率非常高的設計模式，無論是移動應用應用或者桌面應用，觀察者模式幾乎無處不在，它為實現對象之間的聯動提供了一套完整的解決方案，凡是涉及到一對一或者一對多的對象交互場景都可以使用觀察者模式。觀察者模式（Observer Pattern）屬于對象行為型模式的一種，定義對象之間的一種一對多依賴關系，使得每當一個對象狀態發生改變時，其相關依賴對象皆得到通知并被自動更新。 ...

cpupro 2019-08-16 10:56 評論0 收藏0
慕課網_《模式的秘密之觀察者模式》學習總結

摘要：時間年月日星期二說明本文部分內容均來自慕課網。慕課網教學源碼學習源碼第一章觀察者模式概述課程簡介觀察者模式的定義定義對象間的一種一對多的依賴關系。時間：2017年08月29日星期二說明：本文部分內容均來自慕課網。@慕課網：http://www.imooc.com教學源碼：https://github.com/zccodere/s...學習源碼：https://github.com/z...

iKcamp 2019-08-16 10:42 評論0 收藏0
觀察者模式

摘要：簡介學習本篇博文，我們知道在什么場景下使用觀察者模式。觀察者模式給我們在今后開發中什么思想。為什么需要觀察者模式從定義中我們可以知道觀察者模式當對象改變時，其他依賴的對象都會收到改變信息的狀態。簡介 1.學習本篇博文，我們知道在什么場景下使用觀察者模式。2.觀察者模式的優缺點。3.觀察者模式給我們在今后開發中什么思想。場景某家科技公司目前在開發一個項目，設計小組需要上報項目的進度...

Miracle 2019-08-19 11:06 評論0 收藏0
Java 設計模式之觀察者模式

摘要：三內置觀察者模式了解內置觀察者模式包內包含最基本的類與接口，這和上面的接口與接口很類似。根據具體的需求，如果內置的觀察者模式不能滿設計，那么我們可以像剛開始那樣自己實現一套觀察者模式。參考資料設計模式一、了解觀察者模式 1.1 什么是觀察者模式觀察者模式定義了對象之間的一對多依賴，這樣一來，當一個對象狀態改變時，它的所有依賴者都會收到通知并自動更新。典型的問題比如報社，只要你是他...

jsummer 2019-08-19 11:13 評論0 收藏0
RxJava系列二（基本概念及使用介紹）

摘要：作用默認的，直接在當前線程運行總是開啟一個新線程用于密集型任務，如異步阻塞操作，這個調度器的線程池會根據需要增長對于普通的計算任務，請使用默認是一個，很像一個有線程緩存的新線程調度器計算所使用的。這個使用的固定的線程池，大小為核數。轉載請注明出處：https://zhuanlan.zhihu.com/p/20687307 RxJava系列1(簡介) RxJava系列2(基本概念及使...

Profeel 2019-08-14 17:14 評論0 收藏0