A prototype.

Definition: In JS, we use a constructor to create an object. Each constructor has a prototype property that points to an object that holds all of the constructor’s public properties and methods. We call this object the display prototype.

Each object also has an implicit __proto__ attribute, which also points to the object that prototype points to. This is a nonstandard get prototype property and can be replaced with Object.getProtoTypeof ()

Purpose: The purpose of the stereotype object is to store the properties and methods common to the instance.

Explanation: For example, almost every Object can use the toString method naturally because it is stored in Object.ptotoType

Prototype chain: when an instance accesses a method, if it does not have one, it will go to its prototype. If it does not have one, it will go to the prototype of the prototype until it finds the prototype of Object. Otherwise, it is empty.

Two. Extract information

This is not for beginners, as I thought it was when I first encountered the prototype. That’s okay. I’m going to read you the key message.

2.1 Constructors

What are constructors used for? The answer is up there. The correct ones are used to create objects. So how do constructors work? Look at the following

function Cat() {

}
var Cat= new Cat();
Cat.name = 'Kevin';
console.log(Cat.name) // Kevin
Copy the code

Constructor function names are generally capitalized (industry specification)

2.2 the prototype

Every function has a prototype property. Note that every function, from constructors to arrow functions to normal functions, has this property, and this property is also for functions. To code

function Cat () {

}
Person.prototype.name = 'xiaohei';
var person1 = new Person();
var person2 = new Person();
console.log(person1.name) // 'xiaohei';
console.log(person2.name) // 'xiaohei';
Copy the code

So what does prototype point to? Prototype refers to an object that holds all the public properties and methods that the constructor creates instances of. So what’s the name of this prototype? The prototype. good!

2.3 __ proto __

Now that we’ve finished reading about constructors and display prototypes, what’s the difference between __proto__ and prototype?

The first difference is that __proto__ is a property that all JavaScript objects (except null) have. The second difference is that __proto__ is not a canonical property and has been removed from the Web standard. Get the prototype with Object.getProtoTypeof ().

Examples, constructors, archetypal love triangles

The constructor and prototype constructor access the prototype through Prototype

Instance and prototype instances access the prototype through __proto__

An instance accesses the constructor via __proto__ to the stereotype and then via the stereotype’s constructor

The constructor doesn’t point to an instance. It creates so many instances. What if it points to one?

constructor

Each stereotype has a constructor pointing to the associated constructor

Don’t believe it? verify

function Cat() {
}
console.log(Person === Cat.prototype.constructor); // true
Copy the code

We now have a Star constructor with a name attribute and a sing method prototype

Function Star(name){this.name = name // name attribute} star.prototype.sing = function(){console.log(" ")}Copy the code

Var LDH = new Star(” Andy Lau “)

What is the relationship between instance, prototype, and constructor?

You’re opening your mind, guys.

Prototype chain

So let’s go back to the example above

Var LDH = new Star(" LDH ") console.log(ldh.tostring ()) // [object,object]Copy the code

We can see that neither the LDH object nor the LDH constructor nor the prototype has a toString method. But you can print something out, and you don’t know, but you can send us a message that toString is somewhere else.

I don’t want to beat around the bush, but again, look at the paragraph at the top of the article to find the key sentence.

Prototype chain: when an instance accesses a method, if it does not have one, it will go to its prototype. If it does not have one, it will go to the prototype of the prototype until it finds the prototype of Object. Otherwise, it is empty.

Where exactly are all the ToStrings? Follow the prototype

Console. log(ldh.__proto__) // ldh.__proto__ points to the Star prototypeCopy the code

Console. log(ldh.__proto__.__proto__)// ldh.__proto__.__proto__ points to the Object prototype, which is where toString is locatedCopy the code

Thanks for watching, everybody.