实现观察者模式－observer

lei___ 发布于2019-08-23 16:45 / 770人阅读

摘要：来源于阿贤博客观察者模式我们在日常开发使用经常遇到一些场景需要使用到观察者模式，比如登录成功需要改动同步页面多个模块的信息，这时最佳选择是使用观察者模式。

来源于：阿贤博客

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);
    }
};

来源于：阿贤博客

云服务器服务器托管设计模式观察者模式观察者模式 php观察者模式 ios观察者模式

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/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