Prototype and function name in Internet Explorer

[Robert]

Hi,

I thought I pretty much understood the whole prototype chain stuff,
but now I stumbled upon a difference between IE and Firefox, that
is totally confusing me.

An example....
************************
function MyObject()
{
}

MyObject.prototype.open = function open()
{
alert("open");
}

function test()
{
var obj = new MyObject();
obj.open();
window.open("http://www.google.com/", "Google");
}

************************

Notice that I name the function assigned to open. I do this because
I noticed that it can be convenient for stacktraces. Instead of
seeing an anonymous function, I can see the name of it.

Calling test in Firefox will give one "open" alert and one new window,
as I expected.
In Internet Explorer however I will get two "open" alerts!
Somehow the open method of the window object has been overwritten.
Changing the prototype method assignment to
MyObject.prototype.open = function()
"fixes" it, but I want to know why that name causes it to overwrite the
window open method.
And is there any other way to give a name to the method, so it is shown in
any stacktrace?

Kind regards,
Robert

 

[RobG]

Hi,

I thought I pretty much understood the whole prototype chain stuff,
but now I stumbled upon a difference between IE and Firefox, that
is totally confusing me.

An example....
************************
function MyObject()
{

}

MyObject.prototype.open = function open()
{
     alert("open");

}

function test()
{
     var obj = new MyObject();
     obj.open();
     window.open("http://www.google.com/", "Google");

}

************************

Notice that I name the function assigned to open.

Function expressions don't need a name (it's optional), usually they
aren't used as they don't have any useful purpose.

I do this because
I noticed that it can be convenient for stacktraces. Instead of
seeing an anonymous function, I can see the name of it.

So you've found a use for naming anonymous functions.

Calling test in Firefox will give one "open" alert and one new window,
as I expected.
In Internet Explorer however I will get two "open" alerts!

IE (erroneously) adds a named property to the global object as if
you'd declared the function with the name.

Somehow the open method of the window object has been overwritten.
Changing the prototype method assignment to
MyObject.prototype.open = function()
"fixes" it, but I want to know why that name causes it to overwrite the
window open method.

It is an IE bug.

var xx = function yy(){};
alert(typeof yy);

In the above IE shows "function", Firefox (and others) "undefined".

And is there any other way to give a name to the method, so it is shown in
any stacktrace?

Not as far as I know, you'll have to change the name.

 

[António Marques]

Hi,

I thought I pretty much understood the whole prototype chain stuff,
but now I stumbled upon a difference between IE and Firefox, that
is totally confusing me.

An example....
************************
function MyObject()
{
}

MyObject.prototype.open = function open()
{
alert("open");
}

function test()
{
var obj = new MyObject();
obj.open();
window.open("http://www.google.com/", "Google");
}

************************

Notice that I name the function assigned to open. I do this because
I noticed that it can be convenient for stacktraces. Instead of
seeing an anonymous function, I can see the name of it.

Calling test in Firefox will give one "open" alert and one new window,
as I expected.
In Internet Explorer however I will get two "open" alerts!
Somehow the open method of the window object has been overwritten.
Changing the prototype method assignment to
MyObject.prototype.open = function()
"fixes" it, but I want to know why that name causes it to overwrite the
window open method.

Because

xpto = function abc(){...}

is the same as

function abc(){...}
xpto=abc;

That is, from the moment you write 'function abc', you're defining a
variable called 'abc' on that scope, which maps to that function. Since
you're doing that on top level code, it gets defined on the top level.
And the top level's scope is the object 'window'.

Firefox probably just disallows redefining window.open.

And is there any other way to give a name to the method, so it is shown in
any stacktrace?

Maybe you could do it inside some function, e.g.:

(function()
{
MyObject.prototype.open = function open()
{
alert("open");
}
})
()

?

Not that I'm very happy with that, since it probably makes you function
more heavy by including the enclosing function as scope.

If that doesn't do it, I don't think there's any alternative. On the
whole I'd not advise you to do this, as it requires repeating the
function name and that is prone to error. But you could always do it
differently, e.g.:

(function()
{
defineMember(MyObject.prototype, function open()
{
alert("open");
})
})
()

function defineMember(obj, fn)
{
// find the fn's name, by parsing its toString()
// if the engine doesn't supply it otherwise
var fname=...
obj[fname]=fn;
}

 

[dhtmlkitchen]

So you've found a use for naming anonymous functions.

Stack traces are useful things. Especially when using other libraries.

IE (erroneously) adds a named property to the global object as if
you'd declared the function with the name.

Jscript adds the function name to the enclosing Scope's Variable
object. The function is actually parsed as a function declaration
would be; I think it's a problem with the JScript parser.

It is an IE bug.

var xx = function yy(){};
alert(typeof yy);

In the above IE shows "function", Firefox (and others) "undefined".


Not as far as I know, you'll have to change the name.

Yeah, bummer about that.

window.onerror isn't very useful either.

 

[Robert]

It is an IE bug.

var xx = function yy(){};
alert(typeof yy);

Thanks. That makes it clear then. Guess I will go back to anonymous
functions in those cases.

 

[Robert]

Thanks. That makes it clear then. Guess I will go back to anonymous
functions in those cases.

Changed my mind again
I'll use an extra underscore so I'm sure it does not collide with any
pre-defined functions.
The underscore still makes the stacktrace readable, and I'll ignore that
IE adds them somewhere.

 

[dhtml]

Changed my mind again
I'll use an extra underscore so I'm sure it does not collide with any
pre-defined functions.
The underscore still makes the stacktrace readable, and I'll ignore that
IE adds them somewhere.

There might be a way to use conditional comments.

JScript allows function name to have a "."

If you're namespacing, you might be able to get a cc in there to add
the function name with a dot.

ns = {};
ns.F = function ns.F(){};

But that won't work in other engines.