实现观察者模式-observer

发布时间:2021-02-25 发布网站:前端之家 F2er.com
前端之家收集整理的这篇文章主要介绍了实现观察者模式-observer前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

我们在日常开发使用经常遇到一些场景需要使用到观察者模式,比如登录成功需要改动同步页面多个模块的信息,这时最佳选择是使用observer 观察者模式。

class Apm {

constructor(){

//观察者模式

this.observer = {

//订阅

addSubscriber: function (callback,opt) {

this.subscribers[this.subscribers.length] = {

callback: callback,

opt: (opt !== 'undefined') ? opt : {}

};

},

//退订

removeSubscriber: function (callback) {

for (var i = 0; i < this.subscribers.length; i++) {

if (this.subscribers[i].callback === callback) {

delete (this.subscribers[i]);

}

}

},

//发布

publish: function (what,_observer) {

for (var i = 0; i < this.subscribers.length; i++) {

if (typeof this.subscribers[i].callback === 'function') {

let observer = (_observer !== 'undefined') ? _observer : {};

// 执行注册的各种回调

this.subscribers[i].callback({ret: what,opt: this.subscribers[i].opt,observer: observer});

}

}

},

// 将对象o具有观察者功能

make: function (o) {

for (var i in this) {

o[i] = this[i];

o.subscribers = [];

}

}

};

this.observerLogin = {

success: function (ret) {

this.publish(ret,{type: 'success'});

},

error: function(ret){

this.publish(ret,{type: 'error'});

}

};

this.observer.make(this.observerLogin);

}

}

总结


以上是前端之家为你收集整理的实现观察者模式-observer全部内容,希望文章能够帮你解决实现观察者模式-observer所遇到的程序开发问题。

如果觉得前端之家网站内容还不错,欢迎将前端之家网站推荐给前端开发程序员好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。