I. Common Objects and Function Objects

In JavaScript, everything is an object! But the objects are also different. It is divided into ordinary objects and Function objects. Object and Function are function objects built in JS. The following is an example

var o1 = {};
 var o2 =new Object();
 var o3 = new f1();
 
 function f1(){};
 var f2 = function(){};
 var f3 = new Function('str','console.log(str)');
 
 console.log(typeof Object);  //function
 console.log(typeof Function);  //function
 
 console.log(typeof f1);  //function
 console.log(typeof f2);  //function
 console.log(typeof f3);  //function
 
 console.log(typeof o1);  //object
 console.log(typeof o2);  //object
 console.log(typeof o3);  //object

In the above example, o1 o2 o3 is an ordinary object,
F1 f2 f3 is a function object.
How to distinguish, in fact, is very simple, all objects created by new Function () are function objects, and the others are ordinary objects.
F1,f2, in the final analysis, are all created through the new Function ().

Function Object is also created through New Function ().

II. Constructors

Let’s review the knowledge of constructors first:

function Person(name, age, job) {
 this.name = name;
 this.age = age;
 this.job = job;
 this.sayName = function() { alert(this.name) }
 }
 var person1 = new Person('Zaxlct', 28, 'Software Engineer');
 var person2 = new Person('Mick', 23, 'Doctor');

In the above example, person1 and person2 are both examples of Person. Both instances have a constructor attribute, which is a pointer to Person. That is:

console.log(person1.constructor == Person);  //true
 console.log(person2.constructor == Person);  //true

We have to remember two concepts (constructor, instance):

Person1 and person2 are both instances of the constructor Person

A formula:

The instance’s constructor property points to the constructor.

III. Prototype Objects

In JavaScript, whenever you define an object (a function is also an object), the object contains some predefined attributes. Each function object has a prototype attribute that points to the prototype object of the function.

function Person() {}
 Person.prototype.name = 'Zaxlct';
 Person.prototype.age  = 28;
 Person.prototype.job  = 'Software Engineer';
 Person.prototype.sayName = function() {
 alert(this.name);
 }
 
 var person1 = new Person();
 person1.sayName();  // 'Zaxlct'
 
 var person2 = new Person();
 person2.sayName();  // 'Zaxlct'
 
 console.log(person1.sayName == person2.sayName);  //true

We got the first “law” of this article:

1. Each object has an attribute named _ __proto__;

2. Each constructor (constructor standard starts with uppercase, such as Function (), Object (), and other constructors built in JS, as well as those created by itself) has a method named prototype (note: since it is a method, it is an object (function in JS is also an object), so prototype also has _ _ prototype _ _ attribute);

3. The _ _ prototype _ _ property of each object points to the prototype of its constructor;

4. Each object has, __proto__ attributes, but only function objects have prototype attributes.

IV. Prototype chain

V prototype chain
Prototype objects are also common objects. Almost all objects may be prototype objects or instance objects, and they may also be prototype objects and instance objects at the same time. Such an object is exactly a node of the prototype chain. Therefore, if we understand the prototype, then the prototype chain is not a very complicated concept.
We know that all functions have a method called toString. So where exactly is this method?
First declare a function at will:

function add() {}

Then we can use the following diagram to represent the prototype chain of this function.

Prototype chain

Where add is an instance of a Function object. The prototype Object of Function is also an instance of Object prototype. This forms a prototype chain. In fact, the visit of prototype chain is very similar to that of scope chain. They are all a one-way search process. Therefore, the instance object can access all the attributes and methods of the object on the prototype chain through the prototype chain. This is also why foo can finally access the toString method on the Object prototype object.
Based on the characteristics of prototype chain, we can easily implement inheritance.

After understanding the specific basic knowledge, we analyze the following figure

First

First analyze from instance add ()
Instance add () is an instance of Function
so
The _ _ prototype _ _ of add () points to the prototype of its constructor, which is Function.prototype

var add = function () {}
 add.__proto__ ===  Function.prototype//true

Pay special attention to the __proto__ of the constructor Funciton pointing to its own Function.prototype

Function.__proto__ ===  Function.prototype//true

So both _ _ prototype _ _ and prototype of the constructor Function point to Function.prototype

Second

Because Function and Object are js’s own functions.
And Object was also created by new Function.

typeof Function
 "function"
 typeof Object
 "function"

So the _ _ prototype _ _ of Object points to the prototype object of Function, namely Function.prototype

Object.__proto__ === Function.prototype
 true

Therefore, both prototype of Object and _ _ prototype _ _ of Function.prototype point to Object.prototype

Third

Object.prototype is called the e end of the prototype chain because its _ _ prototype _ _ is null