Javascript Scope and this.Variable

Question

So I have some javascript with the following (pseudo) structure. How do I set the this.last_updated variable of the parent function from the showUpdates function, without specifically referencing the name assignment (my_main_function).

var my_main_function = new main()

function main() {
 this.last_updated; 

 function showUpdates(data){
 //set this.last_updated=

 // do Stuff
 }
 this.updateMain(){
  $.ajax({
                 url:"/my_url/"
                 type:"POST",
                 datatype:"json",
                 data: {'last_updated':this.last_updated },
                 success : function(data) { showUpdates(data)},
                 error : function(xhr,errmsg,err) {
                 alert(xhr.status + ": " + xhr.responseText); },
    });
 }
}

even for _pseudo code_ you should make sure that it is clean. Is `main` really surrounding `showUpdates` and `updateMain`, why do you write `var this.main_updated`, Is `this.updateMain` a function that is part of `my_main_function` and if called will to an `ajax` request? — t.niese, Jun 21 '14 at 08:24
I'll change the var name to make it more clear - as you will see updateMain calls the update function passing to the server the timestamp of the last update. — user3467349, Jun 21 '14 at 08:26
What do you mean with `but there is no need for more than one main()` ? You only have one _main_ object and you wont do a `new main` another time? If so you would not need `new main()` at all. — t.niese, Jun 21 '14 at 09:08
I'm a little not used to javascript, I was under the impression that the purpose of a function being assignable to a var was so that you could have multiple instances i.e. var first_timer = new timer(); var second_timer = new timer(); I guess there is no type of function that is declared by default? Because if I only want one timer() - the having a name for both the var and the function seems very redundant. — user3467349, Jun 21 '14 at 09:14
That's not a problem, you can use function to create multiple _instance_ of an object. But if you need an object only once (if you will have the `new main` only once in your code) you don't need to define it that way. — t.niese, Jun 21 '14 at 09:16
Let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/56015/discussion-between-t-niese-and-user3467349). — t.niese, Jun 21 '14 at 09:19
See [How to access the correct `this` / context inside a callback?](http://stackoverflow.com/q/20279484/218196). — Felix Kling, Jun 21 '14 at 09:28

t.niese · Answer 1 · 2014-06-21T09:50:25.660

Updated the code base one the comments:

There are two way of creating objects.

If you need to create the object multiple time you will do it like this:

var YourDefintinon = function() {
};

YourDefintinon.prototype.foo = function() {

};

obj1 = new YourDefintinon();
obj2 = new YourDefintinon();

obj1.foo();

If you only need it once in your code you can just do it like that:

var obj = {

};

obj.foo = function() {

};

foo();

So your would need the main only once your code would look like this:
Using Function.prototype.bind (and its polyfill for older browsers) to bind the showUpdates to the obj.

var main = {
  last_updated : null
};

function showUpdates(data){
  this.last_updated = data.update_time;
}

main.updateMain = function () {
  //<< bind showUpdates  to `this` and save the bound function in the local variabel showUpdates
  var showUpdates = showUpdates.bind(this); 

  $.ajax({
     url:"/my_url/"
     type:"POST",
     datatype:"json",
     data: {'last_updated':last_updated },
     success : showUpdates, //<< uses the showUpdates variable not the function
     error : function(xhr,errmsg,err) {
       alert(xhr.status + ": " + xhr.responseText);
     },
  });
};

As you don't want to make showUpdates accessible to others you could wrap the whole block into a function that is immediatly called:

var main = (function() {
  var main = {
    last_updated : null
  };

  function showUpdates(data){
    this.last_updated = data.update_time;
  }

  main.updateMain = function () {
    var showUpdates = showUpdates.bind(this); 

    $.ajax({
       url:"/my_url/"
       type:"POST",
       datatype:"json",
       data: {'last_updated':last_updated },
       success : showUpdates,
       error : function(xhr,errmsg,err) {
         alert(xhr.status + ": " + xhr.responseText);
       },
    });
  };

  return main;
}());

Javascript Scope and this.Variable

1 Answers1