Question

I have a method that will let me select the prototype object when creating a new object (copied from “Javascript: The Good Parts” book):

Object.create = function(o) {
    var F = function() {};
    F.prototype=o;
    return new F();
}

Now say, I have an object:

var car = {
   model: "Nissan"
};

And I create a new object based on this object, using the “Create” method:

var car1 = Object.create(car);

I can then add a property to car and it will dynamically get added to car1 (dynamic prototyping). So for eg:

car.year=2011;      // Gets added to "car"...
alert(car1.year);   // ... Is also avaialable to car1

Q1) This behavior indicates that “year” got added to car’s prototype, which is why it is available to car1. Is this correct? If not, then where does “year” get added and why is it available to both “car” and “car1”?

Also, per the rule of delegation, if a method cannot be found on an object, it will search its prototype and then check all the prototypes up the chain till it gets to Object.prototype. So now, if I type something like this:

Object.prototype.originCountry = "Japan";
alert(car.originCountry);   // Outputs Japan
alert(car1.originCountry);  // Outputs Japan

So far so good; however, if I do:

Object.carColor= "White";
alert(car.carColor);   // Error!

Q2) When I add a property to “car” (see car.year example above, it gets added to car’s prototype. However, when I add a property to Object, it does not get added to Object’s prototype? If it does get added to Object’s prototype, then why is it not available to “car”, per the rule of delegation?

Why is this happening?

Answer 1

When you do this:

Object.carColor = "White";

Then the property carColor does not get added to the Object‘s prototype. It is now a property of Object. To see what you expect, what you would do is:

Object.prototype.carColor = "White";

Then after that:

alert(({}).carColor); // Will alert "White"

So what happens here is that. any object created including {} (which is nothing but an empty object) is a new instance of Object and hence shares the properties of whatever is set in the prototype of Object.

As for how your Object.create function works. Let us look at it line-by-line:

 1. var F = function() {};

You just create a new function, an essentially blank object. The reason you use a function and not something like {} is because a function can be coupled with a new call to create a new instance of that object wherein the function would act as a constructor.

2. F.prototype=o;

You set the prototype of the new blank function to the object you’ve created. Now, this is purely a reference. It is not a deep-copy. What I mean is that as the object o changes, so will any instances of the objects (actually they won’t change, but they would ‘seem to’ change. More on that later).

3. return new F();

Now you just create a new instance of that function, which has a prototype as the object you passed.

When you do the following:

var car1 = Object.create(car);

You get an object car1 which has the prototype has car. So when you do this:

car.year = 2011

It isn’t like car1 changes. It is more like the object that the prototype refers to changes. So when you do something like:

car1.year

A search is made (first in the prototype, then in the object) for a property called year and turns out, that the prototype has it and hence car1.year will return 2011.

So the bottom line is this:

1. A prototype is shared amongst instances.
2. Changing the properties of an Object will not manifest into any instances changing.