1. 定义
观察者模式 一种对象行为模式。它定义对象间的一种一对多的依赖关系,当一个对象的状态发生改变时,所有依赖于它的对象都得到通知并被自动更新。
2.作用 促进形成松散耦合
3.相关代码
普通对象实现
var subject0=function(){ console.log(‘subject0‘); } var subject1=function(){ console.log(‘subject1‘); } var observer={ callbacks:[], add:function(subject){ this.callbacks.push(subject) }, publish:function(){ this.callbacks.forEach(function(item){ item() }) } } observer.add(subject0); observer.add(subject1); observer.publish();
class 方式实现
var subject0=function(){ console.log(‘subject0‘); } var subject1=function(){ console.log(‘subject1‘); } class Observer{ constructor(){ this.subjects=[] } add(subject){ this.subjects.push(subject) } publish(){ this.subjects.forEach(function(item){ item() }) } } var observer1=new Observer() observer1.add(subject0); observer1.add(subject1); observer1.publish();
改造 ajax 实例 前
$.ajax({ url: "test.html", context: document.body }).done(function(data) { //data数据的处理 $(‘aaron1‘).html(data.a) $(‘aaron2‘).html(data.b) $(‘aaron3‘).html(data.c) //其余处理 });
改造 ajax 实例 后
Observable.add(function() { //pocessData }) Observable.add(function() { $(‘aaron1‘).html(data.a) $(‘aaron2‘).html(data.b) $(‘aaron3‘).html(data.c) }) Observable.add(function() { //pocessOther }) $.ajax({ url: "test.html", context: document.body }).done(function(data) { Observable.fire(data) })
原文:https://www.cnblogs.com/justSmile2/p/11200236.html