Difference between Prototype and Proto

For those who are impatient

'prototype' is just a random name given to the linkage between a function and an unnamed object that gets created at the time of function creation.

while

'proto' is the getter function for fetching the internal linkage between the object referenced by the this keyword and the prototype of the function.

Confused?

Let me explain these terms with the help of an example.
Consider the below code:

  function Foo(who) {
    this.me = who;
  }
  Foo.prototype.identify = function() {
    return "I am " + this.me;
  };

  var a1 = new Foo("a1");
  var a2 = new Foo("a2");

  a2.speak = function() {
    alert("Hello, " + this.identify() + ".");
  };
  a1.constructor === Foo;
  a1.constructor === a2.constructor;
  a1.__proto__ === Foo.prototype;
  a1.__proto__ === a2.__proto__;

Before anything gets executed in the above code we already have somethings, which are:

• A function called 'Object' (capital 'O').
• An object which does not have any name, but a label named '.prototype'.
  

The "Object" function has been linked to the object which does not have any name. On the unnamed object, we have functions like "toString" and several values which are built in the language.

When the first line of above code gets executed following things happen:

• We will have a function called "Foo".
• It's also going to create an "object" that we are linked to, and it will have an arbitrary linkage named: ".prototype". 

  Foo func -------".prototype"-------> unnamed object

• Also the unnamed object gets linked to the unnamed object of the 'Object' function and this linkage is labeled as '[[Prototype]]'. 
• In addition to the above connection, there is also a connection in the opposite direction. The unnamed object has a property on the "function" called ".constructor". 

  Foo function <------".constructor"---- unnamed object

Most people think the '.constructor' means is constructed by. In other words the unnamed object is constructed by the "function". "But its not true".

The word 'constructor' is an arbitrary word it could have been any other random word.

So there is a "two-way" linkage.

Now, when the code "var a1 = new Foo('a1')" gets executed we will have following things:

• A brand new object will gets created.
• The object gets linked to another object. (so the newly created object will get linked to the "unnamed object.")
• The contex gets set to the 'this'. So the newly created object will have a property called 'me', which will have the value 'a1'.
• We return 'this', which gets assigned to the variable 'a1' in the code. So now the name of the newly created object will be 'a1'.
  

So when we execute 'a1.__proto__ === Foo.prototype' it will check whether 'a1' have a '__proto__' property. As it does not have, it will go up in the Prototypical chain and check the same thing on the unnamed object. As that object also does not have the '__proto__' property, so we will go up in the Prototypical chain, which happens to be the unnamed object of the 'Object' function.

Now on this object there is a property named '__proto__'.
It turns out that it is not a property, rather its a 'getter' function. So the above code is a "function call".

This function returns the 'internal prototype' linkage of whatever the 'this' binding is.

So when we have called the '__proto__' function, the 'this' keyword is referencing 'a1'. So this function "returns the internal prototype" linkage of 'a1'. So the "[[Prototype]]" was the internal linkage and '__proto__' is the public linkage of 'a1' with the unnamed object of the 'Foo' function.

So '__proto__' is the public property that references the internal characteristics.

So we can see that 'a1.__proto__' is same as 'Foo.prototype'. The same goes for 'a2'.