why does inline instance creation behave different?

Question

Consider this code:

function Foo() {
}

Foo.prototype.alert = function() {
    alert(this);
}

(new Foo()).alert();

When executed (in jsfiddle), the alert shows that 'this' is the window object. Changing the last line to :

var foo = new Foo();
foo.alert();

works as expected.

Why is the difference?

Answer 1

Your code is actually:

function Foo() {
}

Foo.prototype.alert = function() {
    alert(this);
}(new Foo()).alert();

Because of the missing semicolon, add a semicolon and it will run properly.

Answer 2

It seems that you are missing a semi-colon:

function Foo() {
}

Foo.prototype.alert = function() {
    alert(this);
}; //Semi-colon here!

(new Foo()).alert();​

Here's a fiddle in which it appears to work as you expect.

What is actually happening is that the alert method gets called immediately, with a new instance of Foo passed into it, and alert is then called on the return value (which is undefined):

Foo.prototype.alert = function() {
    alert(this);
}(new Foo()).alert();

As @Nemoy has mentioned, if you just use new Foo().alert() you will get the expected behaviour because automatic semi-colon insertion will put a semi-colon in the right place for you (the lack of a semi-colon doesn't change the meaning of the code). And as the new operator has the highest precedence, the parentheses are not required.