Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > Javascript > Closure scope confusion

Reply
Thread Tools

Closure scope confusion

 
 
codethief
Guest
Posts: n/a
 
      03-19-2010
Hello dear JavaScripters,

I'm currently trying to get a script (http://bitbucket.org/codethief/
pybsd/src/4890d9a4597a/static/js/jquery.inlineedit.js) working and
have run into a problem which you JavaScript gurus surely can solve in
no time unlike me (who certainly doesn't belong to this group, so
please bear with me.)
First of all, I'm doing an initial call, like so:

#
# window = WindowInteraction();
# window.load_url('http://...');
#

.... which should open up a small window / css layer containing the
website with the URL provided.

(BTW: Interestingly, if I use the exact URL for window.load_url()
under this script can be found, Google Chrome loops infinitely whereas
Firefox doesn't. The latter is the wrong behavior since jQuery
executes the JavaScript code in HTML data received over AJAX
(according to the docs). Does Firefox somehow prevent execution of
infinite loops or of JavaScript code received like this?)

Now, let's get to my actual problem in line 161 (http://bitbucket.org/
codethief/pybsd/src/4890d9a4597a/static/js/
jquery.inlineedit.js#cl-161):
The current version works so far which I rather achieved by guessing.
Because:

If I write
# 'success': this.load_html
or
# 'success': load_html
instead of the closure, it won't work at all ('this' is undefined in
load_html, then) because, apparently, the context is lost and
load_html is executed as stand-alone function. This is something I can
follow.
But, why doesn't the following run nicely?

# 'success': function(data) {
# this.load_html(data);
# }

.... results in: "this.load_html is not a function (line: 162)"

Shouldn't 'this' be available in the closure or is it some kind of
special variable? Why does a simply 'load_html(data)' (without 'this.'
in front of it) even work? Are all properties of an object accessible
like this (without 'this.' in front of them) from inside the prototype
function?

Thanks in advance for helping me understand this issue.
 
Reply With Quote
 
 
 
 
Joe Nine
Guest
Posts: n/a
 
      03-19-2010
codethief wrote:
> Hello dear JavaScripters,
>
> I'm currently trying to get a script (http://bitbucket.org/codethief/
> pybsd/src/4890d9a4597a/static/js/jquery.inlineedit.js) working and
> have run into a problem which you JavaScript gurus surely can solve in
> no time unlike me (who certainly doesn't belong to this group, so
> please bear with me.)
> First of all, I'm doing an initial call, like so:
>
> #
> # window = WindowInteraction();
> # window.load_url('http://...');
> #


I think we can stop right there. Choose the name myWindow for example
and you should get much further.
 
Reply With Quote
 
 
 
 
Thomas Allen
Guest
Posts: n/a
 
      03-19-2010
On Mar 19, 10:03 am, codethief <codeth...@gmail.com> wrote:
> # 'success': function(data) {
> # this.load_html(data);
> # }
>
> ... results in: "this.load_html is not a function (line: 162)"
>
> Shouldn't 'this' be available in the closure or is it some kind of
> special variable?


Only if the 'success' function is being applied the execution context
("this") you expect it to be. See http://www.quirksmode.org/js/this.html
for a decent introduction to "this," perhaps someone here knows of a
better one.

> Why does a simply 'load_html(data)' (without 'this.' in front of it)
> even work?


Because the following makes the load_html function available in the
global scope:

> # window = WindowInteraction();


"window" being the host object.

> Are all properties of an object accessible like this (without 'this.'
> in front of them) from inside the prototype function?


No, this worked by coincidence.

Thomas
 
Reply With Quote
 
codethief
Guest
Posts: n/a
 
      03-19-2010
I just realized that the 'new' operator is missing in front of
'WindowInteraction()'. (However, it definitely worked without 'new' in
the way I described above.)
As 'load_html' (without 'this') didn't work, anymore, I figured out
that 'this' may in fact be a special keyword:

# var wi = this;
#
# jQuery.ajax({
# 'url': url,
# 'data': data,
# 'dataType': 'html',
# 'success': function(data) {
# wi.load_html(data);
# }
# });

.... works. So, is this is the only (and your recommended) solution?
 
Reply With Quote
 
codethief
Guest
Posts: n/a
 
      03-19-2010
Oh sorry, I was writing such a long text at first (that I discarded)
that I didn't notice the answers you posted in the meantime. This text
also included some strange things that apparently were caused by me
assigning something to 'window'.
 
Reply With Quote
 
codethief
Guest
Posts: n/a
 
      03-19-2010
Now, that I have read the link you posted, Thomas, I think I
understand the whole issue, now.

Thanks to both of you!
 
Reply With Quote
 
Thomas Allen
Guest
Posts: n/a
 
      03-19-2010
On Mar 19, 10:48*am, codethief <codeth...@gmail.com> wrote:
> I just realized that the 'new' operator is missing in front of
> 'WindowInteraction()'. (However, it definitely worked without 'new' in
> the way I described above.)


The main point, as noted by Joe, is that you shouldn't be trying to
clobber the essential window variable as in your original code.

> As 'load_html' (without 'this') didn't work, anymore, I figured out
> that 'this' may in fact be a special keyword:


Indeed. I'd recommend using an editor with better syntax highlighting
if that wasn't already clear; a good one can make it obvious if you've
accidentally employed a reserved keyword, etc. I recommend vim.

> # var wi = this;
> #
> # jQuery.ajax({
> # * * * 'url': url,
> # * * * 'data': data,
> # * * * 'dataType': 'html',
> # * * * 'success': function(data) {
> # * * * * * * * wi.load_html(data);
> # * * * }
> # });


I think "var me = this", etc. is usually code smell. I see in the
jQuery.ajax documentation that this function accepts a "context"
property, so your code could be:

jQuery.ajax({
url: url,
data: data,
dataType: 'html',
context: this,
success: function(data) {
this.load_html(data);
}
});

Thomas
 
Reply With Quote
 
John G Harris
Guest
Posts: n/a
 
      03-19-2010
On Fri, 19 Mar 2010 at 07:18:08, in comp.lang.javascript, Thomas Allen
wrote:

<snip>
>Only if the 'success' function is being applied the execution context
>("this") you expect it to be. See http://www.quirksmode.org/js/this.html
>for a decent introduction to "this," perhaps someone here knows of a
>better one.

<snip>

That web page is seriously misleading.

For instance
"In JavaScript this always refers to the “owner” of the function
we're executing,"...
isn't true, and use of the word 'owner' is pretty dubious.

For instance
"In other words, we have to copy the function to our onclick
property."
will encourage people to think that functions can be copied by assigning
them.

John
--
John Harris
 
Reply With Quote
 
Thomas Allen
Guest
Posts: n/a
 
      03-19-2010
On Mar 19, 4:11*pm, John G Harris <j...@nospam.demon.co.uk> wrote:
> That web page is seriously misleading.


Agreed, what's the recommended resource for this question? QuirksMode
does have some decent stuff so I thought it'd be OK.

Thomas
 
Reply With Quote
 
David Mark
Guest
Posts: n/a
 
      03-19-2010
John G Harris wrote:
> On Fri, 19 Mar 2010 at 07:18:08, in comp.lang.javascript, Thomas Allen
> wrote:
>
> <snip>
>> Only if the 'success' function is being applied the execution context
>> ("this") you expect it to be. See http://www.quirksmode.org/js/this.html
>> for a decent introduction to "this," perhaps someone here knows of a
>> better one.

> <snip>
>
> That web page is seriously misleading.
>
> For instance
> "In JavaScript this always refers to the “owner” of the function
> we're executing,"...
> isn't true, and use of the word 'owner' is pretty dubious.
>
> For instance
> "In other words, we have to copy the function to our onclick
> property."
> will encourage people to think that functions can be copied by assigning
> them.
>


Yeah, that's vintage PPK. Unfortunately, browser scripting history (as
written on the Web) is full of such follies. I think he wrote a book
about it too. It's so hard getting people to unlearn so much bogus
information.
 
Reply With Quote
 
 
 
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
Is a closure's scope accessible by untrusted code? Andrey Fedorov Javascript 2 10-27-2008 05:29 PM
Another dumb scope question for a closure. Steven W. Orr Python 2 01-09-2008 10:58 PM
How does ruby handle scope and closure in this case? grocery_stocker Ruby 5 08-31-2007 10:54 AM
Scope (closure?) question Kidogg Javascript 2 05-27-2007 02:54 PM
Perl hangs when returning lvalue closure from another lvalue closure Julian Mehnle Perl Misc 0 07-17-2003 03:13 PM



Advertisments
 



1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57