分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > 软件开发

js 观察者模式

发布时间:2023-09-06 01:10责任编辑:胡小海关键词:js

观察者模式定义一种一对多的关系,多个观察者订阅一个主题对象,当主题对象发生改变的时候通知所有观察者,使他们能实现更新。

具体实现方式: 定义一个被观察对象,定义一个主题数组,观察者订阅主题通过往数组对象内添加回调函数来实现,当主题发生改变时轮流调用回调函数。

var subpub= { ???topics: [], ???uid: 0, ???//订阅 ???subscribe: function(topic, callback){ ???????var tmp= this.topics[topic] || [] ???????tmp.push({ ???????????token: ++this.uid, ???????????fun: callback ???????}) ???????this.topics[topic]= tmp ???}, ???//发布 ???publish: function(topic){ ???????if(!this.topics[topic]){return;} ???????var args= Array.prototype.slice.apply(arguments).slice(1) ???????for(var i=0; i< this.topics[topic].length; i ++){ ???????????this.topics[topic][i].fun.apply(this, args) ???????} ???}};subpub.subscribe(‘a‘,function(){ ???alert(1)})subpub.subscribe(‘a‘,function(a, b){ ???alert(a+b)})subpub.publish(‘a‘, 2, 5)

有时我们不喜欢使用那么多this,不想把topics,uid作为被观察对象的参数,则可借助自执行函数的封闭作用域,结合闭包原理来换一种书写方式。

var subpub= {};(function(sp){ ???console.log(sp) ???var topics=[], ???uid=0; ???//订阅 ???sp.subscribe= function(topic, callback){ ???????var tmp= topics[topic] || [] ???????tmp.push({ ???????????token: ++uid, ???????????fun: callback ???????}) ???????topics[topic]= tmp ???}; ???//发布 ???sp.publish= function(topic){ ???????if(!topics[topic]){return;} ???????var args= Array.prototype.slice.apply(arguments).slice(1) ???????for(var i=0; i< topics[topic].length; i ++){ ???????????topics[topic][i].fun.apply(this, args) ???????} ???}}(subpub))subpub.subscribe(‘a‘,function(){ ???alert(1)})subpub.subscribe(‘a‘,function(a, b){ ???alert(a+b)})subpub.publish(‘a‘, 2, 5)

js 观察者模式

原文地址:http://www.cnblogs.com/yanze/p/7500278.html

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved