Observable 观察者模式

资料图片

初探 一个小例子 思想

<script>

    class Subject {
        constructor() {
            this.observerCollection = []
        }

        registerObserver(observer) {
            this.observerCollection.push(observer)

        }

        unregisterObserver(observer) {
            let index = this.observerCollection.indexOf(observer);
            if (index > 0) this.observerCollection.splice(index, 1)
        }


        notifyObserver() {

            if (this.observerCollection.length > 0) {
                this.observerCollection.forEach(observer => {
                    observer.notify();
                })

            } else {
                console.log("Don`t have observer");
            }

        }

    }


    class Observer {
        constructor(name) {
            this.name = name
        }

        notify() {
            console.log(`${this.name} has been notified.`)
        }
    }


    let  sb= new Subject();/ 创建主题对象

    let ob1=new Observer("o1");// 创建观察者
    let ob2=new Observer("o2");// 创建观察者
    let ob3=new Observer("o3");// 创建观察者

    sb.registerObserver(ob1);// 注册观察者
    sb.registerObserver(ob2);// 注册观察者
    sb.registerObserver(ob3);// 注册观察者


    sb.notifyObserver();// 通知观察者


    sb.unregisterObserver(ob3)// 移除一个观察者
    sb.notifyObserver();// 验证是否成功移除

</script>