直播app開發,實現簡單的釋出訂閱者模式

zhibo系統開發發表於2023-01-03

直播app開發,實現簡單的釋出訂閱者模式

1.首先想好誰是釋出者


2.給釋出者新增一個快取列表,存放回撥函式通知訂閱者


3. 釋出訊息,釋出者遍歷快取列表,依次觸發裡面存放的訂閱者回撥函式

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<script>
//釋出者
var showObj = {}
//快取列表  存放回撥函式
showObj.list = []
//增加訂閱者  把訂閱者的回撥壓入快取列表
showObj.listen = function(key,fn){
if(!this.list[key]) {
this.list[key] = []
}
//索引為key的那一項是一個陣列 往不同的key裡存放不同的訂閱者 這樣就可區分開來
this.list[key].push(fn)
}
//釋出訊息  
showObj.trigger = function() {
//取出key
var key = Array.prototype.shift.call(arguments)
var fns = this.list[key]
if(!fns || fns.length == 0) {
return 
}
//遍歷這個陣列 執行這個函式
for(let i = 0,fn;fn = fns[i++];) {
fn.apply(this,arguments)
}
}
//移除訂閱
// showObj.remove = function(key,fn){
// var fns = this.list[key]
// if(!fns) {
// return 
// } 
// if(!fn) {
// !fns && (fns.length === 0)
// } else {
// for(var i = fns.length - 1; i >= 0; i--) {
// var _fn = fns[i]
// if(_fn === fn) {
// fns.splice(i,1)
// }
// }
// }
// }
//訂閱訊息   
showObj.listen('red',function(size){
// console.log('顏色是'+color)
console.log('尺碼是'+size)
})
showObj.listen('black',function(size){
// console.log('顏色是'+color)
console.log('尺碼是'+size)
})
//釋出訊息
showObj.trigger('red',37)
showObj.trigger('black',41)
// showObj.remove('red')
</script>
</body>
</html>

以上就是直播app開發,實現簡單的釋出訂閱者模式, 更多內容歡迎關注之後的文章


來自 “ ITPUB部落格 ” ,連結:http://blog.itpub.net/69978258/viewspace-2930542/,如需轉載,請註明出處,否則將追究法律責任。

相關文章