Javascript - Constructor's properties & Prototype

Question

I'm trying to understand one thing about constructors. Namely I don't understand how function object's properties, aka constructor's properties can't be accessed using Foo.prototype.property, example:

//let's create new function object with predefined properties
function Foo() {
    this.name = "Mike"; 
    this.returnName = function() {
                       return 'This persons name is ' + this.name + '.';
                      };
};

//now let's create new object using constructor and prototypal inheritance
var mike = new Foo();

mike.returnName(); //returns "This persons name is Mike."

I understand that mike inherits properties from Foo's prototype. So these properties must be present inside of the prototype. new object points toward the prototype with internal prototype link using __ proto __. I get that. Thing that I can't get around is how this doesn't work:

Foo.prototype.returnName();

Constructor has .prototype link with prototype property and vice versa prototype has .constructor link with the Foo.

I know that calling the Foo(); function first then calling for window.returnName(); would return the sentence, since this context is set to window.

Is this because when I call the method using prototype it assigns it to the window? Is there any way I could access/call this constructor's property?

Bas Slagter · Accepted Answer · 2015-10-10 20:33:32Z

1

You are not specifying returnName on the prototype of Foo. If you would do it like this:

function Foo(){
    this.name = "Mike"; 
}

Foo.prototype.returnName = function(){
   return 'This persons name is ' + this.name + '.';
};

var mike = new Foo();

mike.returnName();

Things would be different.

edited Oct 10, 2015 at 20:33

answered Oct 9, 2015 at 14:54

Bas Slagter

9,9479 gold badges51 silver badges81 bronze badges

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

2 Comments

Jakub Mazurkiewicz Over a year ago

Ok I think I'm starting to get it. Just 1 more clarification. Where does the mike variable from my example get the properties from? If they aren't present in prototype of Foo rather within Foo function object itself, does this mean that when I call new Foo();, new object gets properties from the constructor and if I ever add property to the prototype it will also gain these? It surely must do right? If it does and I create 100x of instances of that function object I'd have 100 instances with these 2 properties each. Right? Meaning that adding properties to prototype in that case is better?

Bas Slagter Over a year ago

You are absolutely right. That's the whole idea of Prototypal Inheritance ;)

Halcyon · Accepted Answer · 2015-10-09 14:54:03Z

0

The function returnName is not assigned to the prototype of Foo. Instead it's assigned to every instance of Foo, just like the name is "Mike".

Whenever you call new Foo() a new context is created, this is the this context of that instance.

If you call Foo() directly (without new) this is the global object (window).

answered Oct 9, 2015 at 14:54

Halcyon

57.7k10 gold badges93 silver badges131 bronze badges

Collectives™ on Stack Overflow

Javascript - Constructor's properties & Prototype

2 Answers 2

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related