观察者模式的Javascript实现方式

观察者模式也被称作发布/订阅模式，下面是JAVASCRIPT的一种实现方式

var global = window;



(function(ns, base){

	

	//被观察的对象

	function Observable(){

		

		this.observers = {};

	}	

	

	Observable.prototype = {

		

		//subscribe

		bind: function(name, observer){

			var observers = this.observers[name] || ( this.observers[name] = [] );

			var isbind = observer && observers.indexOf(observer) === -1;

			

			if(isbind){

				observers.push(observer);

			}



		},

		

		//unsubscribe

		unbind: function(name, observer){

			var observers = this.observers[name],

				index = observers && observers.indexOf(observer),

				isunbind = (index !== undefined) && (index > -1);

				

			if (isunbind ){

				observers.splice(index, 1);

			}

		},

		

		//publish

		trigger: function (name, args){

			var observers = this.observers[name];

			if(!observers) return;

			

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

				observers[i](args);

			}

		}

	};

	

	Observable.fn = Observable.prototype;

	ns.Observable = Observable;

	

}(global, undefined));

使用示例：

//测试,Model和View解耦

(function(){



	//UserModel，继承Observable

	function UserModel (id){

		this.id = id;

	}

	

	UserModel.prototype =  new Observable(); 

	

	UserModel.prototype.load = function(){

		//ajax load

		var mode = { name: "jser", id: this.id };

		

		//触发loaded事件

		this.trigger("loaded", { target: this, data: mode } );

	

	}

	

	function UserView(){

		this.render = function(data){

			alert("username: "+ data.name);

		}

	}

	

	var user = new UserModel();

	var view = new UserView();

	

	//添加观察者，当UserMode加载完成调用

	user.bind("loaded", function(event){

		view.render(event.data);

	});

	user.load();

}());