Using EventHandler of Library in Javascript and "this" modifier

Question

Just an Example here, Using websocket in browser. Same happened when using Nodejs with ws Library for Websocket.

If you write everything out side a class, all the handlers will be called: EG:

try {
    var host = "ws://localhost:8080";
    var socket = new WebSocket(host); 

    socket.onopen = function(){ 
         // Do something
    } 
    socket.onmessage = function(msg){ // all stuff here will be called upon receiving message
         // Do something
    } 
    socket.onclose = function(){ 
         // Do something
    }            
} catch(exception){ 
     // Do something
}

How ever, if you want to instantiate in a class, non of the handlers will be called

var ws = new webSocketModule();

var webSocketModule = function(){
    try {
        var host = "ws://localhost:8080";
        this.socket = new WebSocket(host); 

        this.socket.onopen = function(){ 
             // Do something
        } 
        this.socket.onmessage = function(msg){ // None of these are called upon receiving message, however the server side will have connection message that means the websocket object is functioning just fine.
             // Do something
        } 
        this.socket.onclose = function(){ 
             // Do something
        }            
    } catch(exception){ 
         // Do something
    } 
}

So is it that I have to do it the messy way of putting everything globally?

To Add to the question

var ws = new webSocketModule();

var webSocketModule = function(){
    try {
        var host = "ws://localhost:8080";
        this.socket = new WebSocket(host); 

        this.socket.onopen = function(){ 
             // Do something
        } 
        this.socket.onmessage = function(msg){
             // Do something
        } 
        this.socket.onclose = function(){ 
             // Do something
        }            
    } catch(exception){ 
         // Do something
    } 
}

ws.socket.onmessage = function(msg){
    // This will be called, kinda confusing
}

================================================================= Added:

var ws = new webSocketModule();  //Explain: This is the instance in the main file

// Down below is in eg: webSocketModule.js
var webSocketModule = function(){
    try {
        var host = "ws://localhost:8080";
        var skt = this.socket = new WebSocket(host); 

        skt.onopen = function(){ 
             // Do something
        } 
        skt.onmessage = function(msg){
             // Using a local variable for socket will not make this respond
             // Another side will successfully show connected and send the message
             // (At least it successfully printed the console log after the socket.send)
             // You have to register it like the above block "ws.socket.onmessage = ..." in the main file to make it respond
             // But this and the object should be the same point of reference right?
             // Seems Javascript handles it differently than JAVA or C++, is there any book that recommended that talks about how browser or NodeJS handles it? thanks.
             // Do something
        } 
        skt.onclose = function(){ 
             // Do something
        }            
    } catch(exception){ 
         // Do something
    } 
}

make them all like the first one by using var socket = this.socket = new WebSocket(host); that way you avoid the repetition, and you still have all the socket properties just a dot away. — dandavis, Aug 19 '14 at 07:21
You need to assign `webSocketModule` before you do `var ws = new webSocketModule()`. — Barmar, Aug 19 '14 at 07:22
do you get any errors? if not, try putting a `console.log('test')` inside the `webSocketModule`. does it get hit? — actual_kangaroo, Aug 19 '14 at 07:34
No error, console didn't log, that was how I knew it didn't respond. THanks :) — victorzzt, Aug 19 '14 at 08:17
var ws = new webSocketModule(); var webSocketModule = function(){ try { var host = "ws://localhost:8080"; var skt = this.socket = new WebSocket(host); skt.onopen = function(){ // Do something } skt.onmessage = function(msg){ // Do something } skt.onclose = function(){ // Do something } } catch(exception){ // Do something } } Socket still works,but handlers were not called — victorzzt, Aug 19 '14 at 08:21

score 0 · Answer 1 · edited May 23 '17 at 12:20

0

are you instantiating your webSocketModule?

var webSocketModule = function() { ... }

var instance = new webSocketModule();

because you assigned webSocketModule to a variable, it must beassigned before it can be used. If you used a named function then it wouldn't matter

edited May 23 '17 at 12:20

Community

1
1

answered Aug 19 '14 at 07:27

actual_kangaroo

5,971
2
31
45

I had "var ws = new webSocketModule();" ws was the instance and the connection is performed correctly. It's only that all the event Handlers that registered using "this" in the constructor didn't respond. Thanks – victorzzt Aug 19 '14 at 08:12

Using EventHandler of Library in Javascript and "this" modifier

1 Answers1