[web] JS: Access class member using 'this' inside an anon function call in a class method
Author
I'm using jquery to make it easy for AJAX calls.
So I create a class: function cMap(mapID){//vars and stuff}
I go and prototype a function: cMap.prototype.loadMap = function(){ //jquery AJAX call }
Now in the jquery $.ajax({...}); call, I use an anonymous function on the "success:" call: success: function(data){ this.member = data; }
My problem is that inside this anonymous function call I'm trying to call a class member of my cMap class to store the data in from the AJAX call, but it's out of scope. So the JS console in FF/Chrome throws errors about bad value/doesn't exist.
How can I access this class member from inside an anonymous function? Or at least what's a good way to go about doing all this?
Thanks in advance! :D
In jQuery 1.4 there is a function called proxy for exactly that purpose. Before that is just used something like smr describes.
Basically var self = this; and then just use self instead of this in the callback.
Basically var self = this; and then just use self instead of this in the callback.
Author
Awesome! It works. Thanks!
Not really sure why it works, though. Seems kind of illogical.
Not really sure why it works, though. Seems kind of illogical.
Quote:Original post by chbrules...Not really sure why it works, though. Seems kind of illogical.
You've likely used closures already by accident.
Read this for a comprehensive insight: javascript Closures
After you have familiarized yourself with the closure feature, and got used to it, coding as a lazy programmer in a language without this feature let you find it lacking in something. ;-)
Quote:Original post by chbrules
Not really sure why it works, though. Seems kind of illogical.
It is actually quite logical. In JS, this is a special variable, just like arguments, that is bound to the function in which it appears. So:
function a(){ this; // from function a arguments; // from function a function b() { this; // from function b arguments; // from function b } var obj = { f : b }; obj.f(1,2); // calls b with this == obj and arguments == [1,2]}Normal variables, however, exist in the scope they were defined in, as well as any scopes within that scope that do not re-define it. So that you achieve:
function a(){ var self; self; // from function a function b() { self; // from function a function c(self) { self; // from function c } }}Among other interesting things from JS, can you guess what the following prints?
for (var i = 0; i < 5; ++i){ setTimeout(function() { alert(i); }, i*1000);}Quote:Original post by ToohrVyk
Among other interesting things from JS, can you guess what the following prints?for (var i = 0; i < 5; ++i){ setTimeout(function() { alert(i); }, i*1000);}
I can't tell you how many times that very issue has gotten me. Although it's a little silly to apply the solution to this minor an example, the illustrative solution to binding down the current value of i is as follows:
for(var i = 0; i < 5; ++i) { setTimeout( (function(i) { return function() { alert(i); } })(i), i*1000);}This topic is closed to new replies.
Advertisement
Popular Topics
Advertisement
