发布订阅模式和观察者模式

1. 发布订阅

先实现一个简单的发布订阅：

const fs = require('fs');
const school = {};
let e = {
    arr: [],
    on(fn) {
        this.arr.push(fn);
    },
    emit() {
        this.arr.forEach(fn => fn());
    }
}


// 订阅
e.on(() => {
    if (Object.keys(school).length === 2) {
        console.log(school);
    }
})


fs.readFile('name.txt', 'utf-8', (err, data) => {
    school['name'] = data;
    // 发布
    e.emit();
});

fs.readFile('age.txt', 'utf-8', (err, data) => {
    school['age'] = data;
    e.emit();
});

// 发布和订阅是没有直接关系的 只是各自操作arr

2. 观察者模式

实现一个简单的观察者模式：

// 被观察者 小宝宝
class Subject {
    constructor() {
        this.arr = [];
        this.state = '我很开心';
    }
    attach(o) {
        this.arr.push(o);  // 原型上的方法 把观察者加到被观察者上
    }
    setState(newState) {
        this.state = newState; // 被观察者的状态发生变化
        // 然后通知观察者 让其更新
        this.arr.forEach(o => o.update(newState))
    }
}
// 观察者
class Observer {
    constructor(name) {
        this.name = name;
    }
    update(newState) {
        console.log(this.name + '小宝宝:' + newState)
    }
}

let s = new Subject('小宝宝');
let o1 = new Observer('我');
let o2 = new Observer('女票');

s.attach(o1);
s.attach(o2);
s.setState('我不开心了');

// 观察者模式 （vue中的watcher）