观察者模式

观察者模式

观察者,被观察者
观察者: 1.状态,通知内容
被观察者:1.属性,状态,添加观察者,删除观察者,触发(发送给观察者)

  /* 观察者函数 */
    class Observer{
        constructor(state,fn=()=>{})
            {
                this.state=state;
                this.fn=fn;
              
            }
    }
    /* 创建观察者 */
    const bzr=new Observer('班主任',(name,state)=>{
        console.log(this.name,this.state);
        console.log(name+'因为:'+state+'被班主任喊你家长来');
    })
    const xz=new Observer('校长',(name,state)=>{
        console.log(name+'因为:'+state+'被校长骂班主任');
    })
    /* 被观察者 */
    class Subject{
        constructor(name,state)
        {   this.name=name;
            this.state=state;
            this.observerOjb=[]
        }
        setState(val)
        {
            this.state=val;
            //触发Observer所有的观察者
            this.observerOjb.forEach(item=>{
                
                item.fn(this.name,this.state)
            })

        }
           //添加观察者
        addObserver(obs)
        {
             /* 存在不添加 */ 
            if(!this.observerOjb.some(item=>item==obs))
            {
                this.observerOjb.push(obs); 
            }
        }
        //删除观察者
        delObserver(obj)
        {
            this.observerOjb=this.observerOjb.filter(item=>item!=obj)
        }
    }
    const xiaoming=new Subject('xiaoming','学习');
    xiaoming.addObserver(bzr);
    xiaoming.addObserver(xz)
    xiaoming.setState('玩游戏');

你可能感兴趣的:(观察者模式)