设计模式-观察者模式

观察？

小明同学：“小时候坐在草地上看着天上飞舞的风筝就能开开心心的度过一整天的时间“；
夏洛克·福尔摩斯：“你是在看，而不是在观察。两者的区别很明显。观察，是有目的、有计划的知觉活动，是知觉的一种高级形式。观，指看、听等感知行为，察即分析思考，即观察不止是视觉过程，是以视觉为主，融其他感觉为一体的综合感知，而且观察包含着积极的思维活动，因此称之为知觉的高级形式。”；
小明同学：“那观察者模式是什么呢？”
夏洛克·福尔摩斯：“观察者模式就是...(此处省略1000字）；
小明同学：”原来是这样啊，我明白了“；

观察者模式

小明同学：“我就用我生活中的事情举一个例子吧。”；
小明同学：“我是一个业余钓鱼爱好者，休息的时候我喜欢去河边钓鱼。”；
小明同学： “钓鱼大家应该都知道，鱼钩挂上鱼饵丢到水里，然后接下来的事情就是不断盯着水面上的浮漂变化”；
小明同学： “以前基本上就是这样一个流程，需要你不断的观察着水面上浮漂的变化”；
小红同学： “那后来呢？”
小明同学： “后来啊，后来就，诶，小红你好！，后来呀就有了高级的鱼竿了，上边装有鱼上钩的报警器，就不需要一直盯着水面上的浮漂了，只需要听到警报的时候去拉鱼杆就行了”；

代码模拟

以前钓鱼

class 鱼竿 {
    constructor() {
        this.鱼饵 = 0；
        this.鱼 = 0；
    }
    工作()  {
        setInterval(() => {
            if (this.鱼饵 > 0) {
                let r = Math.random() * 10;
                if (r >5) this.鱼饵 -= 1;
                if (r >8) this.鱼 += 1;
            } 
        }, 1000);
    }
}

class 小明 {
     constructor() {
        this.鱼竿 = new 鱼竿();
    }
    垂钓() {
        this.鱼竿.工作();
         setInterval(() => {
            this.观察();
         }, 1000);
    }
    观察() {
        if (this.鱼竿.鱼 > 0) {
            this.拉杆();
        }
    }
    拉杆(){
        console.log('鱼上钩了，拉杆');
    }
}

现在钓鱼

class 鱼竿 {
    constructor() {
        this.鱼饵 = 0；
        this.鱼 = 0；
        this.观察者= null；
    }
    工作()  {
        setInterval(() => {
            if (this.鱼饵 > 0) {
                let r = Math.random() * 10;
                if (r >5) this.鱼饵 -= 1;
                if (r >8) this.鱼 += 1;
                if (this.鱼>0) this.报警();
            } 
        }, 1000);
    }
    报警() {
        console.log(''鱼上钩了,快拉杆");
        if (this.观察者 && this.观察者. 拉杆 && (typeof this.观察者. 拉杆 === "function")) this.观察者.拉杆 ();
    }
}

class 小明 {
     constructor() {
        this.鱼竿 = new 鱼竿();
    }
    垂钓() {
        this.鱼竿.观察者= this;
        this.鱼竿.工作();
    }
    拉杆(){
        console.log('鱼上钩了，拉杆');
    }
}