JavaScript簡單手寫觀察者模式

有的人把發布 訂閱模式又叫觀察者模式，它定義對象間的一種一對多的依賴關系，當一個對象的狀態發生改變時，所有依賴於它的對象都將得到通知。

其實他們還是有差別的，在發布訂閱模式中，組件是松散耦合的，正好和觀察者模式相反

發布訂閱模式中，發布者和訂閱者不知道對方的存在。它們只有通過消息代理進行通信。

在觀察者模式中，觀察者（訂閱）是知道被觀察者（發布）的，被觀察者也一直保持對觀察者進行記錄。

下面就來看一下觀察者的簡單實現↓

// 被觀察者
class Subject {
    constructor(name){
        this.name
        this.observers = [] // 觀察者 存放在被觀察者中
        this.state = '停電了，燈不亮'
    }
    // 被觀察者要提供一個接受觀察者的方法
    attach(observer) {
        this.observers.push(observer) // 存放所有觀察者
    }
    setState(newState) { // 改變被觀察着的狀態
        this.state = newState
        this.observers.forEach(o=>o.update(newState))
    }
}
// 觀察者
class Observer{
    constructor(name) {
        this.name = name
    }
    update(newState){ //用來通知所有的觀察者狀態更新了
        console.log(this.name+'說：'+newState)
    }
}
// 被觀察者 燈
let sub = new Subject('燈')
let mm = new Observer('小明')
let jj = new Observer('小健')

// 訂閱 觀察者
sub.attach(mm)
sub.attach(jj)

sub.setState('燈亮了來電了')
// 小明說：燈亮了來電了
// 小健說：燈亮了來電了