JavaScript - The Good Parts: Function prototypes vs Object prototypes

Question

Just finished reading "JavaScript: The Good Parts" - Great book. But I am confused about a very important topic on page 33-34 - Augmenting types. It describes the creation of a new method added to Function.prototype, so when invoked with a new method, all Functions will have that method available. Fair enough. But the subsequent examples show this method being used on Numbers and Strings. Which, I am thinking, are Objects - not Functions. What am I missing here?

Function.prototype.method = function (name, func) {
    this.prototype[name] = func;
    return this;
};

Usage example:

Number.method('integer', function() {
    return Math[this < 0 ? 'ceiling' : 'floor'](this);
});

document.writeln((-10 / 3).integer()); //-3

Answer 1

Function object vs Function instance object

First of all, in javascript, a function is also an object. From this, I mean not the object created by new () construct, but the function itself. To avoid confusion, I would refer such objects as Function object, and for object created using new () construct of a function as Function instance object.

_ proto _ and prototype properties

Any function object in javascript has two properties: _ proto _ and prototype. Moreover, any Function instance object (created using new constructor) has a property _ proto _ . The _ proto _ is what defines the inheritance. Some good resource on this could be found at

http://zeekat.nl/articles/constructors-considered-mildly-confusing.html

How is inheritance defined?

An object objA inherits another object objC if objA and objC are connected through any number of _ proto _ . So if objA has _ proto _ equal to objB, and objB has _ proto _ equal to objC, then objA inherits objB and objC, while objB inherits objC.

What is meant by inheritance?

It means any inheriting object can use any property of inherited object.

What is Function.prototype

It is the object whom _ proto _ of every function object refers. This means every Function object has access to properties of Function.prototype, since every Function object inherits Function.prototype object. This also means that if method property is added to Function.prototype object, it would be available to all the possible Function objects in javascript. This includes Strings, Number, etc.

this.prototype[name] = func;

this refers to Function object when the 'method' is invoked from Function objects like Number, String, etc. Which means that we now have a new property in Function object with name "name", and its a function 'func'.

What good is prototype property of Function object

A function object's prototype is referred to by the Function instance object's _ proto _ created using that function's new construct.

If the following was executed:

Number.method('integer', function () {...});

then Number.prototype has that integer method defined in it. This means each Number function instance object, e.g. new Number (2.4), would "inherit" this new property 'integer' from Number.prototype, since that Number function instance object would have its _ proto _ set to Number.prototype.

Answer 2

You add a method to the Number prototype, so every Number instance has access to it. In other words, because there's a property called "integer" on the Number prototype, any attempt to access that property from any Number instance will succeed. That's kind-of the whole point of putting properties on a constructor prototype.

When a JavaScript primitive number appears on the left side of a . operator, the language automatically boxes it in a Number instance so that the method call makes sense.

edit — let's look at how that "method" function works. In the call

Number.method( "integer", function() { ... } )

what's going on? Well, inside the "method" function, the "name" parameter is "integer". The function parameter is then assigned as a property of this.prototype. What is this in that invocation of the "method" function? It's the Number constructor function. Thus, the "method" function — which is on the Function prototype, and therefore is available to all function instances, like the Number constructor function for example — adds the given function as a property of the prototype of the constructor function involved.

Why is the "method" property visible as a property of the Number constructor? Because the Number constructor is itself a function. The "method" function was created as a property of the Function prototype, so that means it is visible to every function instance — including the Number constructor.