Question

I am using John resig’s implementation class mentioned here: http://ejohn.org/blog/simple-javascript-inheritance/

Now I have a function, which is actually a callback supplied to an ajax method. Now, how do I access the class members inside this function?

—EDIT—

CASE I

Suppose, here is the class I defined:

var Person = Class.extend({
  init: function(isDancing){
    this.dancing = isDancing;
  },
  dance: function(){
    return this.dancing;
  }
});

And I use it like:

var p = new Person(true);

$.ajax({url: url, success: p.dance}); 

Then, in the dance method, this.dancing wont work, because this wont point to the object p.

CASE II:

I am using knockoutjs (http://knockoutjs.com) for binding my UI to the objects. Suppose we have:

var AppViewModel = Class.extend({
  person: new Person()
});

and binding in html would be:

<button data-bind="click: person.dance">Dance</button>

in this case, the ‘this’ in dance would point to the object of AppViewModel, and not person.

The latter case is more important for me.

Answer 1

How about this:

var p = new Person(true);
$.ajax({
    url: url,
    success: p.dance.bind(p)
});

bind() is available in latest browsers but you can provide a graceful downgrade for older browsers as shown on MDN.

And in your preferred case of KnockoutJS you could write this:

<button data-bind="click: person.dance.bind(person)">Dance</button>

I’m not a KnockoutJS user but as I’ve seen a very similar example on their documentation pages this should likely work.