实现一个简单的发布订阅模式_vue订阅者发布者实现

实现一个简单的发布订阅模式_vue订阅者发布者实现JavaScript 发布/订阅模式

大家好,又见面了,我是你们的朋友全栈君。

发布订阅模式可以理解为:

用户关注一个了微信公众号(订阅),当公众号有内容更新时会推送(发布)给所有关注该公众号的用户。

废话不多说直接上代码(此demo仅帮助理解发布/订阅模式):


let Observable = {
    observers:[],     // 订阅者集合
    addObserver:function (observer) { // 添加订阅者
        this.observers.push(observer)
    },
    removeObserver:function (observer) { // 移除订阅者
        let index = this.observers.indexOf(observer);
        if(~index){
            this.observers.splice(index,1);
        }
    },
    notifyObservers:function (message) {  // 向订阅者发布消息
        for(let i = 0; i <= this.observers.length-1; i++){
            this.observers[i](message);
        }
    }
};


function observer1(message){

    console.log(`1---------${message}`);

}

function observer2(message){

    console.log(`2---------${message}`);

}

function observer3(message){

    console.log(`3---------${message}`);

}

// 添加订阅者
Observable.addObserver(observer1);
Observable.addObserver(observer2);
Observable.addObserver(observer3);

// 向订阅者发布(通知)消息
Observable.notifyObservers('hello');

// 移除订阅者
Observable.removeObserver(observer1);

Observable.notifyObservers('test');

输出结果为:
    1---------hello
    2---------hello
    3---------hello
    2---------test
    3---------test
复制代码
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/107189.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • WebSocket实现简单的web聊天室

    WebSocket实现简单的web聊天室WebSocket实现简单的web聊天室1.需要Tomcat7.0所以服务器2.需要JDK7.03.手工加入Tomcat7.0中lib目录下的一下三个包catalina.jar、tomcat-coyote.jar、websocket-api.jar4.项目部署后,请将服务器中当前项目下的catalina.jar、tomcat-coyote.jar、websocket-api

    2022年6月22日
    23
  • 标准红外遥控的接收程序-松瀚汇编源程序

    标准红外遥控的接收程序-松瀚汇编源程序

    2021年12月5日
    52
  • 掌握Mock摆脱后端同学的束缚

    掌握Mock摆脱后端同学的束缚在开发阶段有一个不成文的规定则是`项目开发后端先行`但是作为前端开发工程师的我们,难道在搭建完页面后只能等待后端的接口么?这样的话我们则完全被后端开发限制住了。

    2022年6月20日
    30
  • Ubuntu 18.04 浏览器安装flash[通俗易懂]

    flash官网(注意下载和系统浏览器相对应的包)PPAPI:供Opera(15以上)、Chromium(开源谷歌)浏览器使用NPAPI:适用于FireFox(火狐)、Safari(苹果)、Opera(欧朋,12.17版以下)然后解压:tar-zxvfflash_player_npapi_linux.x86_64.tar.gz复制:sudocplibflashplay…

    2022年4月12日
    67
  • 5分钟入门Cinemachine智能相机系统

    5分钟入门Cinemachine智能相机系统摘要:相机是Unity世界的眼睛,一个智能相机更是能帮咱们节省大把的时间和精力。Cinemachine现在已经大量应用到各种项目中,如果你还没有用过Cinemachine,墙裂建议你来体验一下。你好,我是跟着大智学Unity的萌新,我叫小新,这是我本周的学习总结报告哦。Cinemachine入门Cinemachine入门还是很容易的,5分钟足矣,但是深入去研究里面也有很多门道。安装C…

    2022年5月28日
    45
  • 如何制作一个简单的HTML登录页面(附代码)

    如何制作一个简单的HTML登录页面(附代码)几乎每个网站都会有登录页面,那你知道如何写HTML登录页面吗?这篇文章就和大家分享一个HTML简单登录界面的代码,有一定的参考价值,感兴趣的朋友可以看看。实例:制作一个HTML登录页面,包含邮箱,登录密码,立即注册,忘记密码等,代码如下:HTML部分:<divclass=”dowebok”><divclass=”logo”></div><divclass=”form-item”><inputid=”username”t

    2022年6月13日
    33

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号