Home > Developer > JavaScript
Problem:
There are a lot of operations on the page. We need to display the results of each operation. Here we have a question: how should we display different results? During the presentation process, we also need to consider the increasing number of page functions and the increasing number of results. We need to solve the problem with the best way to cope with these changes.
Solution:
In the development of network disks in 115, we encountered such a problem. After several thoughts, we decided to solve this problem in the following ways:
We can know that we will use an intermediary to receive user information and then send it to the corresponding display topic, so that we can solve the problem that the display mode does not change in segments, how to display the topic code is a problem.
This method is what we usually call the intermediary mode. If you want to learn more, you can go to google or baidu to look at the intermediary mode.
Code:
Now let's write some code. If you have a better solution, you can also give me a comment.
Copy codeThe Code is as follows:
/*
* Intermediary
**/
Var Mediator = function (){
Var self = this;
Var _ messageObj = {};
This. Register = function (key, obj ){
// Register an intermediary
_ MessageObj [key] = obj;
},
This. Send = function (key, message ){
// Send information to the customer based on the customer Key
If (_ messageObj [key]) {
_ MessageObj [key]. Receive (message );
}
}
}
/*
* Customer parent class
**/
Var MessageBase = function (key, mediator ){
Mediator. Register (key, this); // Register an intermediary
}
/*
* Free theme 1
**/
Var MessageObj1 = function (key, mediator ){
MessageBase. call (this, key, mediator); // inherits the parent class
This. Receive = function (message ){
// Receives an intermediary message
Alert ("Object1" + message );
}
}
/*
* Free Theme 2
**/
Var MessageObj2 = function (key, mediator ){
MessageBase. call (this, key, mediator); // inherits the parent class
This. Receive = function (message ){
// Receives an intermediary message
Alert ("Object2" + message );
}
}
Var med; // intermediary
Var init = function (){
// Customer Code
Med = new Mediator ();
New MessageObj1 ("m1", med );
New MessageObj2 ("m2", med );
};
Window. onload = function (){
Init ();
}
Usage:
Copy codeThe Code is as follows:
<A href = "javascript: //" onclick = "med. Send ('m1 ', 'good');"> test1 </a>
<A href = "javascript: //" onclick = "med. Send ('m2 ', 'goodboy');"> test2 </a>
DEMO code:
<! DOCTYPE html PUBLIC "-// W3C // dtd xhtml 1.0 Transitional // EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <ptml xmlns = "http://www.w3.org/1999/xhtml"> <pead> <meta http-equiv =" content-Type "content =" text/html; charset = UTF-8 "/> <title> untitled document </title> </pead> <body> <p> intermediary mode: an intermediary object is used to encapsulate a series of object interactions. The intermediary makes the objects do not need to be explicitly referenced to each other, so that the coupling is loose and the interaction between them can be changed independently. </P> test1 test2 </body> </ptml>
[Ctrl + A select all Note: If you need to introduce external Js, You need to refresh it to execute]
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
