Home > Developer > JavaScript
The socket. io client is very elegant in event processing, which is similar to weboscket's limited javascript interface, but supports more custom events:
Var socket = io. connect ('HTTP: // localhost: 9000/chat ');
Socket. on ('connect ', function (){
// Your code here
});
Socket. on ('announcement ', function (msg ){
// Your code here...
});
Socket. on ('nicknames', function (nicknames ){
// Your code here...
});
View rawgistfile1.jsThis Gist brought to you by GitHub.
EventBus can be used to decouple event Subscriber/event publishers. If the publisher does not know the subscriber, the subscriber only needs to register the subscriber and wait for the notification. EventBus is a simple, efficient, elegant, and good client architecture. Well, fortunately, javascrui itself supports passing functions as parameters, which is not too troublesome.
Building the simplest EventBus javascript library is not difficult:
Yongboy = {};
Yongboy. eventbus = {
Listeners :{
List :{},
Add: function (event, fn ){
This. list [event] = fn;
},
Remove: function (event ){
This. list [event] = null;
}
},
Subscribe: function (event, fn ){
This. listeners. add (event, fn );
},
// Simulate the event interface of socket. io client
On: function (event, fn ){
This. subscribe (event, fn );
},
Broadcast: function (event ){
If (! This. listeners. list [event])
Return;
Var funcHolder = this. listeners. list [event];
If (! FuncHolder)
Return;
FuncHolder. apply (this, []. slice. call (arguments, 1 ));
},
Unsubscribe: function (event ){
This. listeners. remove (event );
}
};
View rawyongboy. eventbus. jsThis Gist brought to you by GitHub.
With less than 40 lines of code, it provides event subscription, event cancellation, event broadcast/publishing, etc. Although simple, it has already met the simplest page-side EventBus model and can provide a full view.
The client uses the event bus code:
<! DOCTYPE html>
<Html>
<Head>
<Meta http-equiv = "Content-Type" content = "text/html; charset = UTF-8">
<Title> Javascript EventBus Example </title>
<Script type = "text/javascript" src = "../js/yongboy. eventbus. js"> </script>
<Script type = "text/javascript">
Var eventbus = yongboy. eventbus;
Eventbus. on ('myevent', function (){
Alert ('Publish Message ~ ');
});
Eventbus. on ('myevent2', function (){
Alert ('Publish Message Again ~ ');
});
Eventbus. subscribe ('myevent3', function (){
Alert ('Publish Message 3rd Times ~ ');
});
Eventbus. on ('myevent4', function (msg ){
Alert ('Publish Message 4th Times with args: '+ msg );
});
Eventbus. on ('myevent5', function (msg, id ){
Alert ('Publish Message 4th Times with args: '+ msg + "id:" + id );
});
Function pubshMsg (event, args ){
Eventbus. broadcast (event, args );
}
Function pubshMsg2 (event ){
Eventbus. broadcast ('myevent5', 'eventbus Msg Here... ', 10 );
}
</Script>
</Head>
<Body>
<Input type = "button" value = "Publish Message With myEvent" onClick = "pubshMsg ('myevent')"/> <br/>
<Input type = "button" value = "Publish Message With myEvent2" onClick = "pubshMsg ('myevent2')"/> <br/>
<Input type = "button" value = "Publish Message With myEvent3" onClick = "pubshMsg ('myevent3')"/> <br/>
<Input type = "button" value = "Publish Message With myEvent4" onClick = "pubshMsg ('myevent4', 'eventbus Msg Here... ')"/> <br/>
<Input type = "button" value = "Publish Message With myEvent5" onClick = "pubshMsg2 ()"/>
</Body>
</Html>
View raweventbus.html This Gist brought to you by GitHub.
The usage of the socket. io client is similar to that of the socket. io client, but the socket. io processing method is much more complicated and some built-in events are added, which is much simpler here.
Well, let's talk about how JAVA implements event bus (EventBus.
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
