W
weston
So, the following apparently works as a method of grafting a method
onto an object (using the squarefree JS shell):
obj = { x: 1, inc: null }
result> [object Object]
obj.inc = function () { this.x++ }
result> function () { this.x++; }
obj.inc()
obj.x
result> 2
And by works, I mean that when I create an object, and then assign one
of its properties an anonymous function, the "this" keyword within said
anyonymous function apparently refers to the object itself. Convenient.
I like it.
The problem is, in the context of an XMLHttpRequest object, this
doesn't seem to work as well for me. Again, using the squarefree js
shell:
xhr = new XMLHttpRequest()
result> [object XMLHttpRequest]
xhr.onreadystatechange = function () { alert(this.responseText); }
result> function () { alert(this.responseText); }
xhr.open("GET","http://www.squarefree.com/shell/shell.html",true)
Now, one might think this would produce an alert containing the
text/html of shell.html. But it doesn't. The value of this.responseText
is apparently undefined.
A slight variation reveals an apparent explanation:
xhr.onreadystatechange = function () { alert(this); }
result> function () { alert(this); }
xhr.open("GET","http://www.squarefree.com/shell/shell.html",true)
This produces an alert that ... displays the code of the anonymous
function itself.
So, apparently, in this case, the "this" keyword refers to the function
itself, and it would seem I can't graft-on methods that have access to
the other properties of the XMLHttpRequest object. At least via the
"this" keyword.
Can someone help me understand what the differences between the two
situations are?
Also... the reason why I'm interested in this largely has to do with
some vague stylistic discomfort. Much of the code I've seen and written
using XMLHttpRequests uses global / lexically scoped variables to get
information across curly-braces between functions. If I could graft
methods onto the request objects themselves, I think I could cut down
on this. I'm open to other suggestions.
onto an object (using the squarefree JS shell):
obj = { x: 1, inc: null }
result> [object Object]
obj.inc = function () { this.x++ }
result> function () { this.x++; }
obj.inc()
obj.x
result> 2
And by works, I mean that when I create an object, and then assign one
of its properties an anonymous function, the "this" keyword within said
anyonymous function apparently refers to the object itself. Convenient.
I like it.
The problem is, in the context of an XMLHttpRequest object, this
doesn't seem to work as well for me. Again, using the squarefree js
shell:
xhr = new XMLHttpRequest()
result> [object XMLHttpRequest]
xhr.onreadystatechange = function () { alert(this.responseText); }
result> function () { alert(this.responseText); }
xhr.open("GET","http://www.squarefree.com/shell/shell.html",true)
Now, one might think this would produce an alert containing the
text/html of shell.html. But it doesn't. The value of this.responseText
is apparently undefined.
A slight variation reveals an apparent explanation:
xhr.onreadystatechange = function () { alert(this); }
result> function () { alert(this); }
xhr.open("GET","http://www.squarefree.com/shell/shell.html",true)
This produces an alert that ... displays the code of the anonymous
function itself.
So, apparently, in this case, the "this" keyword refers to the function
itself, and it would seem I can't graft-on methods that have access to
the other properties of the XMLHttpRequest object. At least via the
"this" keyword.
Can someone help me understand what the differences between the two
situations are?
Also... the reason why I'm interested in this largely has to do with
some vague stylistic discomfort. Much of the code I've seen and written
using XMLHttpRequests uses global / lexically scoped variables to get
information across curly-braces between functions. If I could graft
methods onto the request objects themselves, I think I could cut down
on this. I'm open to other suggestions.