JS模式之簡單的訂閱者和發(fā)布者模式完整實(shí)例
本文實(shí)例講述了JS模式之簡單的訂閱者和發(fā)布者模式。分享給大家供大家參考。具體如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>parten</title> </head> <body> <script> var singletonTest = SingletonTest.getInstance({ pointX : 5 }); console.log(singletonTest.pointX); //easy_Observer_model; function ObserverList(){ this.observerList = []; }; ObserverList.prototype.Add = function(obj){ return this.observerList.push(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(); }; return index; }; function extend(obj,extension){ for(var key in obj){ extension[key] = obj[key]; } }; // function Subject(){ this.observers = new ObserverList(); }; Subject.prototype.AddObserver = function(obj){ this.observers.add(obj) }; 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); }; } //Pubsub//subscribe var Pubsub = {}; (function(q){ var topics = [], subUid = -1; q.publish = function(topic,args){ if(!topics[topic]){ return false; }; var subscribers = topics[topic], len = subscribers ? subscribers.length : 0; while(len--){ subscribers[len].func(topic,args); } return this; }; q.subscribe = function(topic,func){ if(!topics[topic]){ topics[topic] = []; }; var token = (++subUid).toString(); topics[topic].push({ token : token, func : func }); return token; }; q.unsubscribe = function(token){ for(var m in topics){ if(topics[m]){ for(var i=0; i<topics[m].length; i++){ if(topics[m][i].token === token){ topics[m].splice(i,1); return token; } } }; }; return this; } })(pubsub); </script> </body> </html>
希望本文所述對(duì)大家的javascript程序設(shè)計(jì)有所幫助。
- JavaScript設(shè)計(jì)模式之觀察者模式(發(fā)布者-訂閱者模式)
- JavaScript中發(fā)布/訂閱模式的簡單實(shí)例
- JavaScript事件發(fā)布/訂閱模式原理與用法分析
- JavaScript實(shí)現(xiàn)與使用發(fā)布/訂閱模式詳解
- js 發(fā)布訂閱模式的實(shí)例講解
- js實(shí)現(xiàn)的訂閱發(fā)布者模式簡單示例
- JavaScript設(shè)計(jì)模式之觀察者模式(發(fā)布訂閱模式)原理與實(shí)現(xiàn)方法示例
- [js高手之路]設(shè)計(jì)模式系列課程-發(fā)布者,訂閱者重構(gòu)購物車的實(shí)例
- js設(shè)計(jì)模式之代理模式及訂閱發(fā)布模式實(shí)例詳解
- js簡單粗暴的發(fā)布訂閱示例代碼
相關(guān)文章
微信小程序時(shí)間軸實(shí)現(xiàn)方法示例
這篇文章主要介紹了微信小程序時(shí)間軸實(shí)現(xiàn)方法,結(jié)合實(shí)例形式分析了微信小程序wx:for語句使用與時(shí)間軸縱向布局相關(guān)操作技巧,需要的朋友可以參考下2019-01-01javascript 原型與原型鏈的理解及實(shí)例分析
這篇文章主要介紹了javascript 原型與原型鏈的理解,結(jié)合實(shí)例形式分析了javascript 原型與原型鏈的原理、使用方法及相關(guān)操作注意事項(xiàng),需要的朋友可以參考下2019-11-11再談javascript 動(dòng)態(tài)添加樣式規(guī)則 W3C校檢
Ruby's Louvre blog都是一些精品內(nèi)容,下面這個(gè)是介紹javascript 動(dòng)態(tài)添加樣式規(guī)則,而且最后的函數(shù),可以讓你的css通過w3c的驗(yàn)證。2009-12-12javascript文件加載管理簡單實(shí)現(xiàn)方法
這篇文章主要介紹了javascript文件加載管理簡單實(shí)現(xiàn)方法,可實(shí)現(xiàn)順序加載所有js文件的功能,非常簡單實(shí)用,需要的朋友可以參考下2015-07-07JS+HTML5本地存儲(chǔ)Localstorage實(shí)現(xiàn)注冊登錄及驗(yàn)證功能示例
這篇文章主要介紹了JS+HTML5本地存儲(chǔ)Localstorage實(shí)現(xiàn)注冊登錄及驗(yàn)證功能,結(jié)合實(shí)例形式分析了基于JS+HTML5本地存儲(chǔ)Localstorage實(shí)現(xiàn)注冊登錄及驗(yàn)證相關(guān)操作技巧,需要的朋友可以參考下2020-02-02JS小球拋物線軌跡運(yùn)動(dòng)的兩種實(shí)現(xiàn)方法詳解
這篇文章主要介紹了JS小球拋物線軌跡運(yùn)動(dòng)的兩種實(shí)現(xiàn)方法,結(jié)合實(shí)例形式分析了javascript實(shí)現(xiàn)小球拋物線運(yùn)動(dòng)的相關(guān)計(jì)算與圖形繪制操作技巧,需要的朋友可以參考下2017-12-12js判斷文件類型大小并給出提示的實(shí)現(xiàn)方法
下面小編就為大家分享一篇js判斷文件類型大小并給出提示的實(shí)現(xiàn)方法,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過來看看吧2018-01-01