2020-06-21

关于观察者模式在 javajs中的使用

不多比* 纯代码

My Name is wzj. em...

code:

/* Pubsub */
function Pubsub() {
    //存放事件和对应的处理方法
    this.handles = {}
}

Pubsub.prototype = {
    //传入事件类型type和事件处理handle
    on: function(type, handle) {
        if (!this.handles[type]) {
            this.handles[type] = [];
        }
        this.handles[type].push(handle);
    },
    emit: function() {
        //通过传入参数获取事件类型
        //将arguments转为真数组
        var type = Array.prototype.shift.call(arguments);
        if (!this.handles[type]) {
            return false;
        }
        for (var i = 0; i < this.handles[type].length; i++) {
            var handle = this.handles[type][i];
            //执行事件
            handle.apply(this, arguments);
        }
    },
    off: function(type, handle) {
        handles = this.handles[type];
        if (handles) {
            if (!handle) {
                handles.length = 0; //清空数组
            } else {
                for (var i = 0; i < handles.length; i++) {
                    var _handle = handles[i];
                    if (_handle === handle) {
                        //从数组中删除
                        handles.splice(i, 1);
                    }
                }
            }
        }
    }
}

接下来...em..
看看我是怎么样实现的吧!

  1. B类中的update方法是一个通过定时器实时间隔1000ms刷新的方法。
  2. C类中的update方法是一个通过定时器实时间隔1000ms刷新的方法。
  3. B,C都是A的子类。
  4. B的结果通过传递update方法的返回值(这个值是变化的)到c的update方法中。
  5. c类得到实时刷新的update返回值结果与b返回的update结果做出判断
    问1:怎么才能让b中update的实时刷新后的结果在c类中得到结果呢?
    其实大多数时候结果并不是我们想要的!!!
let p1 = new Pubsub()
class A {
   static new() {
       return new this()
   }
   log(val) {
       console.log(val)
   }
}

class B extends A {
   constructor() {
       super()
   }

   update() {
       let ret = [B, new Date().getTime()]
       console.log('b', ret)
       return ret
   }
}

class C extends A {
   constructor() {
       super()
       this.setup()
   }

   setup() {
       this.b = B.new()
       p1.on('updateC', (ret) => {
           this.update(ret)
       })
       setInterval(() => {
           p1.emit('updateC', this.b.update())
       }, 1000)
   }

   update(bRet) {
       console.log('c', bRet)
   }
}
let cInstance = new C()

然后我们看一下运行结果吧!


wangzhaojun.png
zhendishuai.png

完结撒花!觉得很nice的给作者点个赞吧!
跪求。。。


Alt text

你可能感兴趣的:(2020-06-21)