I am trying to create a JavaScript object as follows.
var MyObject = function (parameters) {
this.parameters = parameters;
parameters.userFunction(this.MyObjectCallback);
}
MyObject.SOME_STATIC_VARIABLE = 21;
MyObject.prototype = {
myObjectCallback: function() {
console.log(this);
}
}
The MyObject
object will accept a userFunction to which it will pass a handler. The user function will do some logic and pass the result back to the instance, for example:
new MyObject({userFunction: function(callback) {
$.post(
'http://localhost/~knyttl/source.php',
{},
callback,
'json');,
}});
Unfortunately, even though the callback
is properly called, this
gets an instance of the JQuery
object and not of the MyObject
instance as I would like. To conclude, I can not manage to keep the MyObject
instance.
I am not even sure, whether this is a correct way of creating JavaScript objects. I will be grateful for any suggestion.
See apply() and call().
jQuery allows you to set the context of your callback.
You are in a weird situation where you design has hurt you. Your MyObject can't be passed in as the context, because it is being created at the same time.
So instead:
You can bind a specific
this
value using.bind
. Also I corrected the capitalizing ofMy
.When you call a function like
a.b()
, then insideb
,this === a
. However, if you do not directly call it but only pass the function (likea.b
) and call it later, this binding is lost..bind
returns a new function which now receives the jQuery ajax result asthis
. However, it ignores that and callsmyObjectCallback
with the predefined (bound)this
..bind
is not available on older browsers but there are shims available.Try this.
I would suggest you read, http://javascript.crockford.com/javascript.html
Using this in javascript has the potential to be very confusing. It is assigned the value of whatever is behind the dot when the function is called e.g.
will cause this to be set to window, whereas
will cause this to be set to myDOMElement.
In your case, it comes down to JQuery's internal workings, so have a look at this very thorough set of explanations to get an understanding of how JQuery handles this.