Javascript Mode instance Observer pattern _javascript techniques

There are many cattle in the park have written these articles, but most of the examples are. NET, today I want to give a JS example of use. Interested friends can first understand some of the cattle, such as Li Huijun in the design mode of the Observer section
http://www.cnblogs.com/Terrylee/archive/2006/10/23/Observer_Pattern.html
The core of my own understanding of this pattern is that each observed object changes according to the change of the object's data, and the observed object must be bound by the same changing behavior, which is the uniform interface provided to the observer by the object being observed. The observer will develop the behavior of changing the data.

JS is a weak type of script, a lot of things have to be agreed, not like. NET will have interface constraints, nonsense not to say, we look directly at the example:
Observer instances

Copy Code code as follows:

var observerobj = {/**//* Dependent object * *
FirstName: "Max",
LastName: "Gan",
Id:1
}
var Observermanager = {/**//* Observer * *
Observers:[],/**//* observation object Set * *
Addobserver:function (item) {/**//* added to the observation object * *
This. Observers.push (item);
},
Change:function (obj) {/**//* Change object behavior * *
For (var item in obj) {
Observerobj[item] = Obj[item];
}//changing data dependent object data
for (var i = 0,len = this. Observers.length; i < Len; i++) {
var item = this. Observers[i];
Item. Display (); After the object changes, the behavior display of the observed object is changed; As a unified interface
}
}
}
var Header = function () {/**//* Observation object header*/
This. Display = function () {
alert (observerobj.firstname);
}
}
var Content = function () {/**//* Observation object content*/
This. Display = function () {
alert (observerobj.lastname);
}
}
var Foot = function () {/**//* Observation object foot*/
This. Display = function () {
alert (observerobj.id);
}
}

The above example Observermanager only provides the binding method (Addobserver), other what cancels the binding the code technique and so on, perhaps everybody thought about it. In fact, the ultimate goal of this code is to change the observers data, and other objects will respond according to the change of the data. OK, now we're going to tie them up.

Copy Code code as follows:

/*** bind Observer Action ***/
Observermanager.addobserver (New Header ());
Observermanager.addobserver (New Content ());
Observermanager.addobserver (New Foot ());

How will we use it in the end? (A low-energy problem ...) OH) See examples.
How to use

Copy Code code as follows:

Methods of <!--use-->
<a href= "javascript://" onclick= "Observermanager.change ({FirstName: ' wife '});" > Change firstname</a>
<a href= "javascript://" onclick= observermanager.change ({LastName: ' is Tigress '}); " > Change lastname</a>
<a href= "javascript://" onclick= "Observermanager.change ({id:2});" > Change id</a>

I have attached the whole example, interested friends can download to see.
JavaScript observer mode. rar
How far a man can go depends on who he walks with.