What is a JavaScript prototype? A detailed explanation of JavaScript prototypes

What this article brings to you is about JavaScript prototypes. JavaScript prototype of the detailed explanation, there is a certain reference value, the need for friends can refer to, I hope to help you.

Prototype

Prototypes are still more important, and want to come to the point of this alone, when it comes to prototypes, what is a prototype?

When the constructor is created, there is a prototype (prototype) attribute, which is a pointer to the default creation and association of an object, which is a prototype, the prototype object is an empty object by default, and the purpose of this object is to contain properties and methods that can be shared by all instances of a particular type.
Frankly, you can call the prototype property on the constructor to point to the prototype, creating the prototype object for that object instance.

What are the benefits of using prototypes?

The advantage of using prototypes is that you can have all object instances share the properties and methods that it contains.

Did you turn dizzy? Isn't it super messy? And the constructor, the prototype, and the example, don't worry, I dissected you a word.
All of our constructors eventually evolve into instances to make sense, because defining a method in a constructor cannot be shared by all instances, so only the upper level of the constructor, the prototype, and the properties and methods defined on the prototype can be shared by all instances, which is the nature of the prototype object

Look at a picture, you know, the three of them are triangular love relations

It's easy to understand.
constructor. prototype = Prototype
Prototype. Constructor = constructor
The instance object. Constructor = Constructor (this is because the instance object cannot find the constructor property on its own, so he will find it through the __PROTO__ prototype, which points to the constructor)
The instance object. __proto__ = Prototype

The prototype is printed and cannot be displayed, only through the constructor. Prototype to show

Here are two other ways to get a prototype

isprototypeof () method : Used to determine whether the pointer to this instance points to the prototype.
object.getprototypeof () method : Get the prototype of the instance, this method supports ie9+, Firefox 3.5+, Safari 5+, Opera 12+ and Chrome, Therefore, it is recommended to obtain the prototype of the object by this method.

Assume that there is a person constructor and someone object Person.prototype.isPrototypeof (man)  //return True to indicate that the former is a person1 prototype object.getprototypeof (person) = = = Person.prototype//Get the prototype of person

Multiple object instances share the fundamentals of properties and Methods saved by prototypes
Each time the code reads a property of an object, the search is performed once, and the target is a property with the given name. Start with the object instance itself first. If a property with the given name is found in the instance, the value of the property is returned, and if it is not found, the prototype object that the pointer points to is searched, and the property with the given name is looked up in the prototype object. If this property is found in the prototype object, the property value is returned.

We can access the values in the prototype, but we cannot rewrite the values in the prototype, and if we add an attribute to the instance, and the name of the property is the same as the one in the prototype, this property will mask that attribute in the (replication) prototype.

function person () {}person.prototype.name = "George" Person.prototype.sayName = function () {    Console.log (this.name )}let Person1 = new Person (), let Person2 = new person ();p erson1.name = "Name the most headache";//In this link, Person1.name will be found in his instance, if the instance is not found, continue to search it The prototype Object Console.log (Person1.name); Name the most headache console.log (person2.name); George

Adding a property to an instance object only prevents us from accessing that property in the prototype, but does not modify that property. even if this property is set to NULL, this property is set only in the instance, not its connection to the prototype .

To completely remove instance properties, you can use the delete operator, which allows us to revisit the properties in the prototype.

Use of the delete operator

Still use the above example delete operator can be used to delete an object's properties, whether it is an attribute on an instance, or a property on a prototype can be deleted delete person1.name    //Delete the property of this instance delete Person.prototype.name    //delete properties on prototype Delete Person.prototype.constructor//Delete constructor property so there is no way to refer back to the function

The hasOwnProperty () method can be used to detect whether a property exists in an instance or in a prototype. This method returns true only if the given property exists in the object instance, or it can be understood that the hasOwnProperty method is used to detect whether the property is an object's own property.
Obj.hasownproperty (' attribute name ')

Demo:

function person () {   this.name = ' Name the headache '}var person = new person () Person.prototype.age = ' Console.log ' ( Person.hasownproperty (' name '))  //Trueconsole.log (Person.prototype.hasOwnProperty (' age '))//True

In operator

The in operator has two uses
① is used in the for-in loop, For-in is able to return all the enumerable (enumerable) attributes that can be accessed through the object (enumerable properties can be seen at a glance