关于前端:发布订阅模式

公布订阅（pubsub）

公布-订阅模式又叫观察者模式，它定义对象间的一种一对多的依赖关系，当一个对象状态产生扭转时，所有依赖于它的对象都将失去告诉

留神：一对多（一指的是公布，多指的是订阅），是先订阅再公布

作用：

（1）反对简略的播送通信，当对象状态产生扭转时，会主动告诉曾经订阅过的对象

（2）能够利用在异步编程中，代替回调函数，能够订阅ajax之后的事件，只须要订阅本人须要的局部

（3）对象之间的松耦合

（4）跨组件之间的传值

如何实现公布–订阅模式？

1.首先要想好谁是发布者？

2.而后给发布者增加一个缓存列表，用于寄存回调函数来告诉订阅者

3.最初就是公布音讯，发布者遍历这个缓存列表，顺次触发外面寄存的订阅者回调函数

//定义一个发布者

var shoeObj ={}

//有一个列表用来寄存函数

shoeObj.list=[]

//减少订阅者

shoeObj.listen =function(key,fn){

​        if(!this.list[key]){

​            this.list[key]=[]

​        }

​        this.list[key].push(fn)

}

//公布音讯

shoeObj.trigger =function(){

//取出这个key

var key =Array.prototype.shift.call(arguments)

var  fns = this.list[key]



//遍历这个数组 而后执行这个函数

if(!fns || fns.length ==0){

​    return

}

​    for(var i =0,fn; fn = fns[i++]){

​            fn.apply(this,arguments)

}

}

//订阅

shoeObj.listen('red',function(size){

​    console.log('小红订阅的尺码是${size}');

})



shoeObj.listen('black',function(size){

​    console.log('小明订阅的尺码是${size}');

})

//移除订阅

if(!fns){

return false;

}

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)

}

}

}

//公布

shoeObj.trigger('red'，'37')

shoeObj.tigger('black'，'42')