Let's say I have a basic dumb javascript class :

var FunctionX = function(configs) {
this.funcConfigs = configs;
}

FunctionX.prototype.getData = function() {
  return $.get('/url');
}

FunctionX.prototype.show = function(promise) {
  console.log(this.funcConfigs); // <-- this here is the promise itself, I'm looking to get the instance's configs
}

FunctionX.prototype.setup = function() {
  this.GetData().then(show);
}

var f = new FunctionX({ "a": "b" });
f.setup();

Now I'm trying here in the show function to access the instance variable "funcConfig". "This" is the promise, and "funcConfigs" directly returns undefined.

I tried to resolve this issue with a .resolveWith(this) but it does not solve this issue.

How can I access the instances variables in this scope context?

Let's say I have a basic dumb javascript class :

var FunctionX = function(configs) {
this.funcConfigs = configs;
}

FunctionX.prototype.getData = function() {
  return $.get('/url');
}

FunctionX.prototype.show = function(promise) {
  console.log(this.funcConfigs); // <-- this here is the promise itself, I'm looking to get the instance's configs
}

FunctionX.prototype.setup = function() {
  this.GetData().then(show);
}

var f = new FunctionX({ "a": "b" });
f.setup();

Now I'm trying here in the show function to access the instance variable "funcConfig". "This" is the promise, and "funcConfigs" directly returns undefined.

I tried to resolve this issue with a .resolveWith(this) but it does not solve this issue.

How can I access the instances variables in this scope context?

• javascript
• this
• jquery-deferred

• Nothing to do with promises, only this in functions invoked with different contexts. – user2864740 Commented Dec 3, 2013 at 22:19
• See stackoverflow./questions/14561723/this-in-callback-functions , stackoverflow./questions/346015/… , stackoverflow./questions/10120271/… and similar – user2864740 Commented Dec 3, 2013 at 22:21
• I put back in the jquery-deferred tag for use of resolveWith, which tries to approach the problem from the opposite way (e.g. specifies a context, doesn't bind to an existing context). If that "does not solve the issue" then this is already wrong in the context resolveWith is used. – user2864740 Commented Dec 3, 2013 at 22:26
• Does that code actually run? I could understand this.getData().then(this.show); (though you may still have the same issue). – Beetroot-Beetroot Commented Dec 4, 2013 at 5:36

1 Answer 1

In agreement with user2864740, the issue is most likely caused because this is not what you expect it to be when show is invoked as a callback. To make this work properly, you need to capture the proper this in a closure (e.g. var that = this;), and invoke it explicitly.

In other words...

FunctionX.prototype.setup = function() {
   var that = this;

   this.getData().then(function () {
      that.show();
   });
}

EDIT: For a slightly cleaner syntax (using underscore.js):

FunctionX.prototype.setup = function() {
   var that = this;

   this.getData().then(_.bind(this.show, this));
}