前端JavaScript之手写实现：观察者模式

观察者模式

观察者模式：当对象间存在一对多关系时，则使用观察者模式（Observer Pattern）。比如，当一个对象被修改时，则会自动通知依赖它的对象。观察者模式属于行为型模式。

    // 观察者模式
    // 目标对象类
    class BeObserverd {
    
    
        constructor() {
    
    
            // 记录观察者的数组
            this.observerList = []
        }
        addObserver(observer) {
    
    
            // 加入观察者数组
            this.observerList.push(observer);
        }
        notify(...args) {
    
    
            // 通知观察者
            for (let i = 0; i < this.observerList.length; i++) {
    
    
                this.observerList[i].update(...args);
            }
        }
    }
    // 观察者类
    class Observer {
    
    
        constructor() {
    
    
            // 观察后执行行为的函数数组
            this.todo = []
        }
        addTodo(todo) {
    
    
            this.todo.push(todo);
        }
        update(...args) {
    
    
            for (let i = 0; i < this.todo.length; i++) {
    
    
                this.todo[i](...args);
            }
        }
    }
    // 观察者模式示例
    const beObserverd = new BeObserverd();
    const observer = new Observer();
    observer.addTodo((name) => console.log('say hi! ' + name));
    beObserverd.addObserver(observer);
    beObserverd.notify('Tom');