JavaScript prototype, prototype chain, prototype chain inheritance

Source: Internet
Author: User

prototypes

in JavaScript , there are two types of prototypes: Display Prototypes (prototype) and implicit prototypes (__proto__).

__proto__(implicit prototype)

any object in JavaScript has a built-in property [[prototype]]and there is no standard way to access this built-in property before ES5, but most browsers support it through __proto __ to visit. ES5 has a Get method object.getprototypeof () for this built-in property standard .

prototype(an explicit prototype)

This is a property specific to the function object. This property is a pointer to an object that is used to contain properties and methods shared by all instances (we call this object a prototype object). The prototype object also has a property called constructor, which contains a pointer to the original constructor.

For example:

var a = {};console.log (a.__proto__);//= = = Object {...} Console.log (A.prototype);//= undefined function B () {}console.log (b.__proto__)/= = function () {[native code]}c Onsole.log (b.prototype)//= = Object {...}

Note: The __proto__ value of the object.prototype is null.

distinguishing between __proto__ and prototypedefinition

The concept of these two rankings has been explained in the above, not to repeat.

function

prototype : used to implement prototype-based inheritance and attribute sharing.

__proto__ : form the prototype chain, which is also used to implement prototype-based inheritance.

the relationship between the two

__proto__ points to the prototype of the constructor in ES5 and points to the constructorin es6 .

Summary

    1. Any object (in javascript __proto__, prototype

2. Function Objects In addition to the attribute __proto__, there are properties prototype,prototype The prototype object that points to the method ( prototype ).

prototype chain

in JavaScript , each object and prototype object (prototype) has a prototype (__proto__), and the object's prototype points to the constructor (parent) 's prototype object ( Prototype), whilethe prototype object (prototype) is the archetype (__proto__) that points to theparent's prototype object (prototype), This creates a relationship that is connected through a prototype layer, which we call the prototype chain . It sounds like a mouthful, I simply drew a diagram to help you understand:

650) this.width=650; "title=" prototype chain. png "src=" https://s2.51cto.com/wyfs02/M02/9A/BC/ Wkiol1lz9dvi0vmwaaa7r6annse162.png "alt=" Wkiol1lz9dvi0vmwaaa7r6annse162.png "/>

by visible,__proto__ is the key to realize the prototype chain, and prototype is the component of the prototype chain. In addition, the __proto__ of all constructors/functions points to Function.prototype, which is an empty function.

prototype chain inheritance

when a property of an object is accessed, it is first searched inside the object, if any, it is returned to the property value, and if not found, it islooked up from theprototype object (the constructor's prototype) pointed to by the object's prototype (__proto__). If it is still not found, it continues tobe looked up from the prototype object pointed to by the prototype object (prototype) (__proto__), and so on, until it isfound and returns undefined if it is not found .

Using this idea, we direct the prototype object of the subclass to an instance of the parent class, and all instances created by the subclass inherit all the properties of the parent class, which is the prototype chain inheritance. Such as:

function parant (name, age) {this.name = name; This.age = age;} Parant.prototype.say = function () {console.log (' Hello, my name is ' + this.name);}; function Child () {}child.prototype = new parant (' pursue '), var man1 = new Child (); Man1.say (); Hello, my name is pursuevar man2 = new Child () console.log (Man1.say = = = Man2.say);//trueconsole.log (Man1.name = = = MAN2.N AME);//true


This article is from the "Front End Engineering Lion" blog, please be sure to keep this source http://xiedr.blog.51cto.com/12552842/1944101

JavaScript prototype, prototype chain, prototype chain inheritance

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.