Invoking a function Object in JavaScript

Question

I have a small question in JavaScript.

Here is a declaration:

function answerToLifeUniverseAndEverything() {
   return 42;
}

var myLife = answerToLifeUniverseAndEverything();

If I do console.log(myLife), it will print 42, as I am just invoking the same instance of function resulting in 42 as the answer. (Basic rule on JavaScript that only references of objects are passed and not the object.)

Now, on the other, hand if I do:

var myLife = new answerToLifeUniverseAndEverything();

then I can't invoke the function; instead, myLife becomes just an object? I understand that this is a new copy of the same function object and not a reference, but why can't I invoke the method?

Can you please clarify the basic fundamental I am missing here?

Crescent Fresh · Accepted Answer · 2009-12-17 08:14:07Z

3

By prefixing the call to answerToLifeUniverseAndEverything() with new you are telling JavaScript to invoke the function as a constructor function, similar (internally) to this:

var newInstance = {};
var obj = answerToLifeUniverseAndEverything.call(newInstance); // returs 42
if (typeof obj === 'object') {
  return obj
} else {
  return newInstance;
}

JavaScript proceeds to initialize the this variable inside the constructor function to point to a new instance of answerToLifeUniverseAndEverything. Unless you return a different Object yourself, this new instance will get returned, whether you like it or not.

answered Dec 17, 2009 at 8:14

Crescent Fresh

117k27 gold badges157 silver badges140 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

IS4 Over a year ago

Not the same, you can return a function.

Amber · Accepted Answer · 2009-12-17 08:14:08Z

3

When you do var myLife = answerToLifeUniverseAndEverything();, myLife is simply holding the return value from the function call - in this case, 42. myLife knows nothing about your function in that case, because the function was already called, returned, and then it assigned the resulting value (42) to the new variable myLife.

A completely different thing happens when you do var myLife = new answerToLifeUniverseAndEverything(); - instead, a new object is created, passed to the function as this, and then (assuming the function doesn't return an object itself), stored in the newly created variable. Since your function returns a number, not an object, the newly generated object is stored.

answered Dec 17, 2009 at 8:14

Amber

531k89 gold badges643 silver badges558 bronze badges

Comments

cletus · Accepted Answer · 2009-12-17 08:12:05Z

1

Try:

function answerToLifeUniverseAndEverything() {
  return 42;
}

var myLife = answerToLifeUniverseAndEverything;

alert(myLife());

When you do:

var myLife = answerToLifeUniverseAndEverything();

you're assigning the function result to myLife ie 42.

answered Dec 17, 2009 at 8:12

cletus

627k169 gold badges922 silver badges945 bronze badges

Comments

olliej · Accepted Answer · 2009-12-17 08:12:22Z

1

I think i've described the behaviour of new elsewhere. Basically when you do new f() the JS engine creates an object and passes that as this, then uses that object if the return value of f() is not an object.

eg.

o = new f();

is equivalent (approximately) to

temp = {};
temp2 = f.call(temp);
o = typeof temp2 === "object" ? temp2 : temp;

answered Dec 17, 2009 at 8:12

olliej

36.9k9 gold badges61 silver badges55 bronze badges

Comments

DMI · Accepted Answer · 2009-12-17 08:12:49Z

1

If I do console.log(myLife) It'll print 42, as I am just invoking the same instance of function resulting in 42 as the answer. (Basic rule on javascripts that only references of objects are passed and not the object)

Not quite. This is because you're assigning the return value of answerToLifeUniverseAndEverything() to myLife. If you wanted to make a copy of the function, drop the brackets:

var myLife = answerToLifeUniverseAndEverything;
console.log(myLife());

answered Dec 17, 2009 at 8:12

DMI

7,2512 gold badges27 silver badges26 bronze badges

Collectives™ on Stack Overflow

Invoking a function Object in JavaScript

5 Answers 5

1 Comment

Comments

Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

1 Comment

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related