ansaurus

Question

Redeclared javascript global variable overrides old value in IE

Answer 1

+1 A:

If you expect y to be global, you can just drop the var y line altogether in your second file.

The reasoning behind this is that since you want y to be global anyway, just treat it like its a global and already declared. JavaScript's side-effect of making variables global when declared without the var prefix plays to your favor in this situation. Tested in IE8, this works just fine.

Edit: As to why this happens, I'd chalk it up to it just being a bug in a combination of IE's handling of globals across files and declaration hoisting. Really, though, you should only be declaring any variable, but especially a global, in one place. Your problem can be avoided by following this rule of thumb.

Justin Johnson 2010-04-14 05:16:43

Thanks for that suggestion. Makes sense. Though it would still be interesting to know why this doesn't behave correctly in IE.

Yousuf Haider 2010-04-14 05:55:42

Surprisingly, it seems that IE may have a bug in its JavaScript implementation.

Justin Johnson 2010-04-14 07:10:11

Yes, ideally we would want to declare a global in only one place. My use case was that I had multiple js files each of which was declaring a namespaced class using this pattern:Script1 :if (!a) a = {};a.b = function() {....};Script2if (!a) a = {};a.c = function() {....};Now this works fine until the first script uses window.a or window['a'] to declare a and then IE breaks. Since multiple pages can choose which files to include each of them have to check whether a exists.

Yousuf Haider 2010-04-14 20:02:44

I figured as much. This is similar to `dojo.declare`. You might want to take a look to see how they did it or maybe even just use dojo: http://api.dojotoolkit.org/jsdoc/1.3/dojo.declare

Justin Johnson 2010-04-15 00:22:49

Funnily enough this bug came up because I had my own custom dojo widget as well as my own class using the same namespace prefix.For eg. a.myDojoWidget (dojo widget)followed by a.myClass (simple js class)The problem is that dojo.declare declares the class in this fashion:window['a'] = {}, and then a['myDojoWidget'] = ..I've avoided this issue (based on your suggestion) by not doing var a.

Yousuf Haider 2010-04-15 01:42:14

Answer 2

+1 A:

This is happening in IE because the line of re-declaration is setting y to undefined. Then the line testing if y is not set passes and y changes to "new".

Change the second script to:

//redeclaration of the same variable
var y;

alert(y); // is undefined in IE

if (!y) y = 'new';

alert(y); //shows New instead of Old in IE

Jonathan 2010-04-14 05:23:06

Right I understand that. But if you were to merge the contents of the 2 files in one single place y would no longer be undefined and the redeclaration would not set y to undefined. As a result the alert would show 'old'

Yousuf Haider 2010-04-14 05:53:20

In IE all declarations are executed before other parts of the code. In the second include if you make the first line alert(window['y']) you'll see that the value is undefined. If you comment out the redeclaration line you'll see the expected 'old' appear.

Jonathan 2010-04-14 06:07:13

Actually, this happens in all browsers and is called *hoisting*; however, it seems that IE is doing it wrong in this scenario and causing an overwrite.

Justin Johnson 2010-04-14 07:12:06

http://www.adequatelygood.com/2010/2/JavaScript-Scoping-and-Hoisting

Jonathan 2010-04-14 08:10:15

Answer 3

+2 A:

Simplified test case:

<script>
    window.foo= 1;
</script>
<script>
    var foo;
    alert(foo);
</script>

And yes, this absolutely is a bug in IE's JScript engine.

Why does it happen? Why does IE do any of the crazy things it does? Make an irritated noise, move on, try to avoid doing this...

bobince 2010-04-14 07:54:02

Alright, finally I am not insane.

Yousuf Haider 2010-04-14 18:08:01

If you've narrowed it down to “something wrong with you” and “something wrong with IE”, go with IE every time...

bobince 2010-04-14 18:34:33

ansaurus

tags:

views:

answers:

Redeclared javascript global variable overrides old value in IE

related questions