using getJSON in a class (scoping issue)

Question

//this is a class
function SpriteSheetClass()
{
    this.sprite="local";

    $.getJSON(url, this.onLoaded);      
}   

SpriteSheetClass.prototype.onLoaded= function(json) 
{
    console.log(this.sprite); //returns undefined!

    //I am out of SpriteSheetClass scope! how do I store the json???
}

var a=new SpriteSheetClass()

When the getJSON callback is executed, the scope is not in the class. There is no way to bind the returned json with my class instance (a)

Keep in mind I want to keep the calls async, and I need to create many instances of SpriteSheetClass This is not a timing question, it is a scope question.

thanks

adeneo · Accepted Answer · 2014-08-03 17:35:03Z

1

When the callback function is called, this will not be the object, but the $.getJSON function.

You can bind the value of this to the callback, so it will be the object instead

$.getJSON(url, this.onLoaded.bind(this));

FIDDLE

answered Aug 3, 2014 at 17:35

adeneo

319k29 gold badges410 silver badges392 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

epascarello · Accepted Answer · 2014-08-03 17:35:31Z

1

With modern day browsers you can use function.bind(thisArg) to keep the proper scope.

function SpriteSheetClass() {
    this.sprite="local";
    $.getJSON(url, this.onLoaded.bind(this));
}

answered Aug 3, 2014 at 17:35

epascarello

208k20 gold badges206 silver badges246 bronze badges

Comments

Paul Roub · Accepted Answer · 2014-08-03 17:34:00Z

0

A local wrapper function will do the job:

function SpriteSheetClass() 
{
   this.sprite="local";
   var that = this;

   var callback = function(data) {
     that.onLoaded(data);
   };

   $.getJSON(url, callback);
}

answered Aug 3, 2014 at 17:34

Paul Roub

36.5k27 gold badges88 silver badges95 bronze badges

Collectives™ on Stack Overflow

using getJSON in a class (scoping issue)

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related