Network Security Internet Technology Development Database Servers Mobile Phone Android Software Apple Software Computer Software News IT Information

In addition to Weibo, there is also WeChat

Please pay attention

WeChat public account

Shulou

What is the JavaScript prototype chain?

2025-01-17 Update From: SLTechnology News&Howtos shulou NAV: SLTechnology News&Howtos > Development >

Share

Shulou(Shulou.com)06/01 Report--

This article mainly shows you "what is the JavaScript prototype chain", the content is easy to understand, clear, hope to help you solve your doubts, the following let the editor lead you to study and learn "what is the JavaScript prototype chain" this article.

1. Constructors and instances

Suppose you declare a method called Foo (), then we can declare the instance through new Foo ().

Function Foo () {console.log ("I am a constructor");} const F1 = new Foo ()

Now you can clearly see that Foo () is the constructor and F1 is an example of it.

2. Attribute Prototype

The constructor Foo () is a method.

Method is also an object data type, so it can be said that a method is an object.

Objects have properties, but methods have their own special property, called prototype, and other objects do not.

This property will point to a prototype object (Foo.prototype), and the prototype object will have its own property called constructor, which contains a pointer to the original constructor.

Function Foo () {console.log ("I am a constructor");} const F1 = new Foo (); console.log (Foo.prototype); / / Foo prototype object console.log (f1.prototype); / / F1 has no underfied

3. Attribute _ _ proto__

The prototype above provides shared methods and properties for all instances of the constructor.

How does the instance access shared methods and properties?

The F1 instance does not have a prototype, but has a property _ _ proto__, which is a property common to all objects, which points to the prototype object that constructs its own constructor, and then the js language accesses the shared properties and methods based on this property.

Foo is the constructor of F1, and Foo.prototype is the prototype object of Foo, so f1.roomprotoplast _ points to Foo.prototype.

Function Foo () {console.log ("I am a construction method");} const F1 = new Foo (); console.log (Foo.prototype); console.log (f.

4. Access the methods on the prototype

If the constructor Foo wants its own instance to have the same property, such as name, it adds it to its prototype object.

Function Foo () {console.log ("I am a method");} Foo.prototype.name = "I am the property of instance sharing created by Foo"; const F1 = new Foo (); const f2 = new Foo (); console.log (f1.name); / / I am the property console.log (f2.name) of instance sharing created by Foo; / / I am the property of instance sharing created by Foo

5. The constructor also has _ _ proto__

It says above that all objects have _ _ proto__, and Foo is both a function and an object, so what is Foo.__proto__?

Then find out who is the constructor of Foo. Foo is a function with unique methods and properties of the function. The constructor created by Foo is Function, a constructor that comes with this js, and its Function.prototype provides some common methods and properties that come with the function to all the functions you create in js.

So Foo.__proto__ points to Funtion.prototype.

6. The prototype of the constructor also has _ _ proto__

Foo.prototype is also an object, so it also has _ _ proto__.

Whenever we want to find _ _ proto__, we have to find its constructor. Foo.prototype is an object, pure object, so its constructor is Object, then the prototype of Object is Object.prototype.

Foo.prototype.__proto__ points to Object.prototype

7. Object.prototype is a very special prototype object.

The constructors Array, String, Funtion, Object are all functions.

Are examples of Funtion constructors

Array.__proto__, String.__proto__, Funtion.__proto__, Object.__proto__ point to Funtion.prototype prototype

You can call some public methods of the Funtion.prototype prototype

For example, you can call .name to see the name of your function.

Prototype objects such as Array.prototype, String.prototype and Funtion.prototype are all objects.

Are examples of Object constructors

Array.prototype.__proto__, String.prototype.__proto__, Funtion.prototype.__proto__ point to Object.prototype prototype

So you can call the public method of the prototype object Object.prototype

Object.prototype is something special. Although it is an object, it is not an instance of Object itself.

Object.prototype.__proto__ points to null as the end of the prototype chain

8. Summary

The method, that is, the function, has the prototype, which is the prototype of the method.

So for an instance, there is usually a corresponding constructor, that is, the constructor, and the _ _ proto__ of the instance points to the prototype of the constructor.

Js has many native constructors, such as Array, String, Funtion, and Object, which are assigned according to some object types of js, and their prototypes provide many encapsulated common methods.

All constructors themselves are functions and are examples of Funtion, the native constructor of js.

With the exception of Object.prototype, the prototypes of all constructors are objects themselves, and are instances of Object, js's native constructor.

Object.prototype.__prototype points to null as the end of the prototype chain.

The above is all the content of this article "what is the JavaScript prototype chain?" Thank you for reading! I believe we all have a certain understanding, hope to share the content to help you, if you want to learn more knowledge, welcome to follow the industry information channel!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.

Views: 0

*The comments in the above article only represent the author's personal views and do not represent the views and positions of this website. If you have more insights, please feel free to contribute and share.

Share To

Development

Wechat

© 2024 shulou.com SLNews company. All rights reserved.

12
Report