订阅发布模式
举个例子：比如你订阅邮箱报纸，他会不定期给你发送，当你想看的时候，你打开邮箱就能看所有的报纸（按订阅顺序）。
那么订阅报纸就是订阅，读报纸就是发布-
一张图说明
订阅发布 代码说明
// 核心事件 中介
function Event(){
this.events=[];
}
Event.prototype.on=function(fn){ //订阅
this.events.push(fn);
}
Event.prototype.emit=function(data){ //发布
this.events.forEach(function(fn){
fn(data);
})
}
- 应用
- 处理异步（不好用）
//eg: 读完这两个txt才能执行
let schoolInfo = {},event=new Event;
event.on(function () {
if (Object.keys(schoolInfo).length === 2){
console.log(schoolInfo)
}
});
fs.readFile('./name.txt','utf8',function (err,data) {
schoolInfo['name'] = data;
event.emit();
});
fs.readFile('./age.txt', 'utf8', function (err, data) {
schoolInfo['age'] = data;
event.emit();
});
- vue子组件向父组件发射数据
观察者模式
举个例子：比如你想洗脸，又想沏茶，还要做饭，那么你需要烧一壶水，那么你就可以先准备好肥皂、茶叶、蔬菜，等着水烧开了就可以干这些事情了。
那么洗脸、沏茶、做饭就是观察者，烧水就是被观察者。-
一张图说明
观察者与被观察者 代码说明
function Subject() { // 我家孩子的类
this.observers = [];
this.state = '开心';
}
Subject.prototype.attach = function (observer) {
this.observers.push(observer);
}
Subject.prototype.setState = function (state) {
this.state = state;
this.notify();
}
Subject.prototype.notify = function () {
this.observers.forEach(function (observer) {
observer.update();
})
}
function Observer(name,target){ // 观察者 一般会有一个方法
this.name = name;
this.target = target;
}
Observer.prototype.update = function () { // 更新方法
console.log(`通知：${this.name} 当前的状态是 ${this.target.state}赶紧哄`)
}
let subject = new Subject();
let observer1 = new Observer('丈夫', subject);
let observer2 = new Observer('媳妇', subject);
subject.attach(observer1); // 给目标添加观察者
subject.attach(observer2);
subject.setState('不开心');
孩子是被观察者，父母是观察者，被观察者状态变化，就通知观察者做某件事
- 应用
- vue 数据变化通知视图更新
