Home > Developer > JavaScript
In JavaScript, each constructor automatically generates an object after it is loaded, and we call this object a prototype object.
2, the relationship between the constructor and the prototype objectThe person constructor and the person prototype object behave independently in memory and do not affect each other. However, there is a prototype attribute in the person constructor that points to the person prototype object, and there is also a property in the person prototype object that points to the person constructor.
3, the role of prototype objectsWhen we refer to a nonexistent property or method in the instance object of the person constructor, the system automatically looks for the property in the prototype object of the person constructor.
4, how to prove that the prototype and constructor attributes are mutually pointing relations<!DOCTYPE HTML><HTML><Head><MetaCharSet= ' utf-8′><title></title></Head><Body><Script>//define a Preson constructorfunctionPreson () {}//instantiating a P1 object through the person constructorvarP1= NewPreson (); alert (p1.constructor.prototype.constructor.prototype.constructor);</Script></Body></HTML>
5, the actual application of prototype objects
In actual project development, we often use some out-of-the-box frameworks or objects written by others, and if we find that there are no attributes, how do we solve them?
A: You can extend properties using prototype objects
1) Adding properties to the prototype object
Example code:
<!DOCTYPE HTML><HTML><Head><MetaCharSet= ' utf-8′><title></title></Head><Body><Script>//define a Preson constructorfunctionPreson () {}//instantiating a P1 object through the person constructorvarP1= NewPreson ();p 1.name=' Lisi';p 1.age = 22; Preson.prototype.email = ' [email protected]'; alert (p1.email); //The P1 object accesses a non-existent email attribute</Script></Body></HTML>
2) Adding a member method to the prototype object
<!DOCTYPE HTML><HTML><Head><MetaCharSet= ' utf-8′><title></title></Head><Body><Script>//define a Preson constructorfunctionPerson () {}//instantiating a P1 object through the person constructorvarP1= NewPerson ();p 1.name=' Lisi';p 1.age = 22;//Defines the Speak member method for the person prototype object Person.prototype.speak = function () {alert (this.name+ '--' +this.age ');} P1.speak (); Call the non-existent speak member method of the P1 object </script></body>
6, explore the prototype of where the object came from
The following code is automatically executed during the creation of the prototype object:
constructor. prototype = new Object ();
Note: When we access a nonexistent property or method through the instantiation object of the person constructor, the system is automatically p1 to the prototype object of the person constructor, and since all the prototype objects are instances of the object class, The prototype object automatically inherits all the properties and methods in the object class, and we can conclude that:
The P1 object automatically inherits all the properties and methods in the object constructor.
P1. Properties à prototype object. property = new Object (); So it can be concluded
The P1 object automatically inherits all the properties and methods in the object constructor.
We call this inheritance relationship: Prototype inheritance
Prove:
<!DOCTYPE HTML><HTML><Head><MetaCharSet= ' utf-8′><title></title></Head><Body><Script>//define a Preson constructorfunctionPerson () {}//instantiating a P1 object through the person constructorvarP1= NewPerson ();p 1.name=' Lisi';p 1.age = 22;alert (p1.hasownproperty (' name '));</script></body>
7. Prototype Chain
When we access a non-existent property or method, the system will go up to the first-class constructor of the prototype object to look for, if not found, then continue to the upward-level prototype object to look for, we put this chain query relationship, called the prototype chain.
Prove:
<!DOCTYPE HTML><HTML><Head><MetaCharSet= ' utf-8′><title></title></Head><Body><Script>//define a Preson constructorfunctionPerson () {}//instantiating a P1 object through the person constructorvarP1= NewPerson ();p 1.name=' Lisi';//defines an age property for the person prototype Object Person.prototype.age = 23;//defines an email attribute for the obj prototype object Object.prototype.email = ' [email Protected]'alert (p1.age); alert (p1.email) ;</Script></Body></HTML>
Kill lui lei dog---javascript no:28 prototype chain
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
