__proto__ VS. prototype in JavaScript

Question

This figure again shows that every object has a prototype. Constructor function Foo also has its own __proto__ which is Function.prototype, a

Answer 1

'use strict'
function A() {}
var a = new A();
class B extends A {}
var b = new B();
console.log('====='); // =====
console.log(B.__proto__ === A); // true
console.log(B.prototype.__proto__ === A.prototype); // true
console.log(b.__proto__ === B.prototype); // true
console.log(a.__proto__ === A.prototype); // true
console.log(A.__proto__ === Function.__proto__); // true
console.log(Object.__proto__ === Function.__proto__); // true
console.log(Object.prototype === Function.__proto__.__proto__); // true
console.log(Object.prototype.__proto__ === null); // true

In JavaScript, Every object(function is object too!) has a __proto__ property, the property is reference to its prototype.

When we use the new operator with a constructor to create a new object, the new object's __proto__ property will be set with constructor's prototype property, then the constructor will be call by the new object, in that process "this" will be a reference to the new object in the constructor scope, finally return the new object.

Constructor's prototype is __proto__ property, Constructor's prototype property is work with the new operator.

Constructor must be a function, but function not always is constructor even if it has prototype property.

Prototype chain actually is object's __proto__ property to reference its prototype, and the prototype's __proto__ property to reference the prototype's prototype, and so on, until to reference Object's prototype's __proto__ property which is reference to null.

For example:

console.log(a.constructor === A); // true
// "a" don't have constructor,
// so it reference to A.prototype by its ``__proto__`` property,
// and found constructor is reference to A

[[Prototype]] and __proto__ property actually is same thing.

We can use Object's getPrototypeOf method to get something's prototype.

console.log(Object.getPrototypeOf(a) === a.__proto__); // true

Any function we written can be use to create an object with the new operator, so anyone of those functions can be a constructor.