Home>

The observer mode is also called the observer mode.It is one of 23 software design patterns proposed by gof.The observer mode is one of the behavior modes.Its role is when the state of an object changes,Ability to automatically notify other associated objects,Automatic refresh object status

The observer mode is also called the observer mode.It is one of 23 software design patterns proposed by gof.The observer mode is one of the behavior modes.Its role is when the state of an object changes,Ability to automatically notify other associated objects,Automatically refresh object status.

The concept of observer mode

The observer mode is one of the behavior modes.Its role is when the state of an object changes,Ability to automatically notify other associated objects,Automatically refresh object status.

The observer mode provides a means of synchronous communication for associated objects.Synchronize an object with other objects that depend on it.

The role of observer mode:

subject (observed)

Observed object.When the state that needs to be observed changes,All observer objects in the queue need to be notified.The subject needs to maintain (add, delete, notify) a queue list of observer objects.

concretesubject

Observed implementation.Contains some basic attribute states and other operations.

observer

Interface or abstract class.When the status of the subject changes,The observer object will be notified via a callback function.

concreteobserver

Observer implementation.After being notified, some specific business logic processing will be completed.

Observer mode (also known as publisher-subscriber mode) should be one of the most commonly used modes. It is widely used in many languages. Including the dom events we usually contact. It is also an observer pattern implemented between js and dom.

div.onclick=function click () {
alert ("click")
}

As long as the div's click event is subscribed. When the div is clicked, the function click will be triggered.

So what exactly is the observer mode? First look at the observer pattern in life.

There is a famous saying in Hollywood. "Don't call me, I will call you ". This sentence explains the ins and outs of an observer pattern. Where "I" is the publisher, "You" is a subscriber.

For another example,When I came to the company for an interview,After the interview, every interviewer would say to me, "Please leave your contact information We will notify you when there is news. "" I "is a subscriber here, The interviewer is the publisher.So I do n’t have to ask the interview results every day or every hour. The communication initiative is in the hands of the interviewer.And I just need to provide a contact method.

The observer mode can well achieve the decoupling between the two modules. Suppose I am developing a html5 game in a team. When the game starts,Need to load some picture material.After loading these images, the game logic is executed. Suppose this is a project that requires multiple people to collaborate. I completed the gamer and map modules, and my colleague a wrote an image loader loadimage.

The code of loadimage is as follows

loadimage (imgary, function () {
map.init ();
gamer.init ();
})

When the image is loaded, Render the map again, Perform game logic. Well, this program works well. Suddenly one day, I remember thinking of adding sound to the game. I should have the image loader add a line of code.

loadimage (imgary, function () {
map.init ();
gamer.init ();
sount.init ();
})

But the colleague a who wrote this module went to travel abroad. So I called him, Hello. Where is your loadimage function, Can i change it, Are there any side effects after the change? As you think, All kinds of uneasy things happened. What if we could write this:

loadimage.listen ("ready", function () {
map.init ();
})
loadimage.listen ("ready", function () {
gamer.init ();
})
loadimage.listen ("ready", function () {
sount.init ();
})

After loadimage is completed, It doesn't care what will happen in the future, Because its work is done. Next it just needs to publish a signal.

loadimage.trigger ("ready");

Objects that have listened to the "ready" event of loadimage will receive notifications. Just like the example from the previous interview. The interviewer doesn't care where the interviewers will eat after receiving the interview results. He is only responsible for collecting the resumes of the interviewers. When the interview results come out, follow the call on the resume one by one.

Having said so many concepts, Here comes a concrete implementation. The implementation process is actually very simple. The interviewer threw the resume into a box, The interviewer then held the resume in the box at the appropriate time to call the results one by one.

events=function () {
var listen, log, obj, one, remove, trigger, __this;
obj=();
__this=this;
listen=function (key, eventfn) {//throw the resume box, The key is the contact method.
var stack, _ref;//stack is a box
stack=(_ref=obj [key])!=null?_ref:obj [key]=[];
return stack.push (eventfn);
};
one=function (key, eventfn) {
remove (key);
return listen (key, eventfn);
};
remove=function (key) {
var _ref;
return (_ref=obj [key])!=null _ref.length=0:void 0;
};
trigger=function () {//The interviewer calls to inform the interviewer
var fn, stack, _i, _len, _ref, key;
key=array.prototype.shift.call (arguments);
stack=(_ref=obj [key])!=null?_ref:obj [key]=[];
for (_i=0, _len=stack.length;_i<_len;_i ++) {
fn=stack [_i];
if (fn.apply (__this, arguments) === false) {
return false;
}
}
return {
listen:listen,one:one,remove:remove,trigger:trigger
}
}

Finally, use the observer mode to make a small application for adult TV stations.

//subscriber
var adulttv=event ();
adulttv .listen ("play", function (data) {
alert ("Who's the movie today" + data.name);
});
//announcer
adulttv .trigger ("play", {"name":"Nozomi Aso"})
  • Previous What does public static void main (String args []) mean in Java
  • Next Next-generation Eclipse goes into the cloud