A talk on the understanding _javascript skills of JS message mechanism and event mechanism

The message/event mechanism is the mechanism of almost all development languages, not deviceone, in some languages called messages (Event), in some places called (message). In fact, the principle is similar, but some of the way to achieve a more complex. We call the news deviceone unification.

Message Basics Concepts

There are some beginners who are not familiar with this mechanism, let's start with a brief introduction to some basic concepts, if familiar people can skip this section.
A/message can be understood as a data structure that contains the following basic sections:

1. Source: Is the source of the message, the object that sent this message

2. Message name: Is the only indication of the message

3. Message data: The data that comes with the message, it is possible that the data is empty

Messages can be grouped into 2 different categories:

1. System message: The message is sent by the operating system or the Deviceone system, and the name of the message is fixed.

2. Custom message: Defined by the developer, the message is sent by itself, the name of the message is arbitrary and can be defined arbitrarily.

An example is provided:

For example, a user clicks on a Do_button button that triggers a system message that contains 3 parts:

1. Message Source: The button object in the user point

2. Message Name: Touch

3. Message data: There is no data attached to this message

For example, the user triggers a custom event through the Do_button button, which contains 3 parts:

1. Message Source: Button Object

2. Message name: User's casual definition, called AAA,BBB,CCC can be

3. Message data: The accompanying data is set by the time the message is triggered

Publish/Subscribe Mode

Publish/Subscribe mode is one of the most common design patterns, is the core of the message mechanism, its characteristics is to reduce the coupling degree, so that two independent objects are not dependent on each other. A brief introduction, familiar students can skip.

Let's start with a simple example of reality to illustrate this problem, refer to the following figure:

From this diagram we can see

1. Consumers and publishers do not know each other, consumers do not need to know what the magazine he wants is specific to the publishing house, and publishers do not need to know the specific person who set their publishing house published books.

2. Both consumers and publishers must know the Post office.

3. Consumers need to tell the post Office consumer's name address and the name of the magazine you want to subscribe to

4. Multiple consumers can subscribe to the same magazine

5. After the post office get the magazine, will inform the consumer, notice when the magazine sent to the consumer hand.

After reading the actual example above, we can see that the abstract description will be clearer, look at the following figure:

And the actual example above describes one by one corresponds:

1. System/Developer and function objects are not dependent on each other, the system/developer just triggers a message, does not care who to accept

2. System/Developer and function objects must be able to get the message source object

3. Function object Subscription message needs to indicate the name of the message and the reference to the function object

4. Multiple function objects can subscribe to a message with the same name as one word

5. The message source triggers a message that notifies all subscribers and passes the data to the callback function object

After reading the abstract description, we will finally look at the actual Deviceone development examples, or Do_button as an example.

1. When the user clicks a button and touches it, the system acquires the button as the source of the message, fire a "touch" message, and any function object that subscribes to the "touch" message will receive the message and cause the function to execute.

Gets the button object
var Btn_hello = UI ("Btn_hello");
Defines function object function
f () {
//When Btn_hello this button receives a finger click it executes the following code
Deviceone.print ("F function receives click Trigger message")
}
function f () {
//When Btn_hello this button receives a finger click will execute the following code
Deviceone.print ("F function receives click Trigger message")
}
//f, F Subscribe to Button's Touch message
btn_hello.on ("touch", f);
Btn_hello.on ("Touch", f);

2. We can define 2 custom message "Message1" and "Message2" for the button object, and 2 function objects subscribe to the 2 messages respectively. But the final trigger for this message must be the developer calling the fire function to trigger, which is the difference from the system message.

Gets the button object
var Btn_hello = UI ("Btn_hello");
Defines function object function
F (d) {
//When Btn_hello this button receives a developer-triggered message messages, the following code is executed
deviceone.print ("F function to receive message messages, the data is: "+d"
}
function f (d) {
//When Btn_hello this button receives a developer-triggered message messages will execute the following code
Deviceone.print ("F function receives message messages, the message data is:" +d)
}
//f,f Subscribe button's Touch messages
Btn_hello.on ("messages", f);
Btn_hello.on ("message", f);
Trigger Message
Btn_hello.fire ("Messages", "data");
Btn_hello.fire ("message", "data");

See here, you must be surprised, why do we have to customize the object on the button? What's the meaning of this god horse? In fact, there is no meaning and there is no need, here just take the button to give examples, in the regular development, the basic will not be so used.

Use of messages

So much has been said before, and now is the use of deviceone messages. The use of system events and custom events is basically illustrated by using the above example, which is actually very simple.

There are a few concepts to explain

All objects of 1.deviceone, including UI,MM,SM objects, can be message sources

The SM object can be the message source
var page = SM ("Do_page");
Page.On ("Loaded", function ()) {
//This is the system message for the Page object, this message does not need to be manually triggered, the system automatically triggers
}
page.on ("message", function (d) {
//This is a custom message for the Page object
}
page.fire ("Messages", "data");
The MM object can be the message source
var http = mm ("do_http");
Http.on ("Result", function ()) {
//This is a system message for the HTTP object, which does not need to be manually triggered, and will automatically trigger the response of the HTTP server after receiving the feedback from
http.on (" Message ", function (d)) {
//This is the HTTP object's custom messages
}
http.fire (" News "," data ");
The UI object can be the message source
var alayout = UI ("alayout_id");
Alayout.on ("Touch", function ()) {
//This is the Alayout object's system message, this message does not need to be manually triggered, the mobile phone clicks will trigger
}
Alayout.on ("message" , function (d)) {
//This is the custom message for the Alayout object
}
alayout.fire ("Messages", "data");

2. The message source object has scope, so the message source for the subscription and triggering must be the same object as a scope. This is understood in conjunction with data sharing and data transfer documents.

Looking at the following example, Test1.ui and Test2.ui are likely to be in a page scope, or maybe not in a job domain, and only a message in a scope fire can deliver the callback function correctly.

To determine whether it is the same, you can print the address of the page page.getaddress ().

Subscribe to Test.ui.js message
var page = SM ("Do_page");
Deviceone.print (Page.getaddress ());
Page.On ("Message", function (d)) {
deviceone.print (d);
}
The test.ui.js triggers the message
var page = SM ("Do_page");
Deviceone.print (Page.getaddress ());
Page.fire ("message", "data");

If you are not in the same page scope, you can subscribe the message to the app scope that 2 page can share to
The above code is changed to:

Subscribe to messages in Test.ui.js
var app = SM ("Do_app");
App.on ("Message", function (d)) {
deviceone.print (d);
}
In Test.ui.js trigger message
var app = SM ("Do_app");
App.fire ("message", "data");

3. The same function object can repeatedly subscribe to an object source of the message, triggering the message will make the function many times, this is a beginner often make mistakes.

var page = SM ("Do_page");
var count =;
function f () {
deviceone.print ("Execution times" + (count++));
}
Page.On ("message", f);
Page.On ("message", f);
Page.fire ("message");

Look at the example above, if executed, will print 2 this, because the subscription 2 times, perhaps you will say who will write such code? The reality is certainly not so easy to see to perform the duplicate on function, often in the case of the click of the event to perform the on function, each click on the button, repeat the subscription once.

4. Message subscriptions must be in the message before the trigger, this is a beginner often make mistakes.

var page = SM ("Do_page");
var count =;
function f () {
deviceone.print ("Execution times" + (count++));
}
Page.fire ("message");
Page.On ("message", f);

Look at the example above, if executed, will have no effect, perhaps you will say who will write such code? The actual situation is certainly not so easy to see the reverse of the order, the actual situation is often such as the on function executes in a function of a callback function, you cannot determine when the callback function to execute, whether it is performed before fire. Generally encountered this situation can add a few deviceone.print to print to see if it is on first or fire first execution.

5. There are subscriptions to unsubscribe, unsubscribe is off function, the reason is rarely used, because the closepage will automatically be the current page scope of the message to subscribe to release all.

However, if the message subscription is in the app scope, it is important to note that you may need to unsubscribe manually. Otherwise, a problem occurs that causes the function to execute multiple times when the message is triggered.

var page = SM ("Do_page");
var count =;
function f () {
deviceone.print ("Execution times" + (count++));
}
Page.On ("message", f);
Page.fire ("message");
. Page.off ("message");
Page.fire ("message");

Looking at the example above, printing only executes once, because the fire is canceled after one time.