JavaScript objects inherit attributes from a prototype object. All objects have the original type; all attributes of the prototype look like the attributes of the objects that use it as the prototype. Simply put:All objects inherit attributes from their prototype..
(Each object inherits properties from its prototype ).
The prototype of the object is defined by its constructor function. All functions in JavaScript have a prototype attribute. This attribute is empty at first, and any attribute you add to it will be owned by the object created by constructor.
The prototype object is associated with the constructor. This means that prototype can be used as an ideal place for placement methods and other constants. The attributes in the prototype will not be copied to the newly created object. Their attributes look like the attributes of the object. This means that using the prototype can greatly reduce the memory occupied by multiple similar objects.
Each class has only one prototype object with a set of attributes. However, we may create multiple class instances at runtime. What happens if a prototype attribute is read/written?
When you read an attribute, JavaScript first tries to find whether the object itself has this attribute. If not, it then searches for the prototype. If yes, the result is returned.
When you write the attributes of a prototype, because multiple objects share the prototype, you obviously cannot directly perform write operations on the prototype. In fact, JavaScript will create an attribute with the same name on the object and write the value to it. When you read this attribute next time, JavaScript will find it in the object's attribute, so you do not need to look for it in the prototype. In this case, we say "the attributes of an object mask or hide the attributes of the prototype ". (Shadows or hides ).
From the above discussion, we can see that when designing a class, we only need to master one principle:In the prototype, only some methods (methods do not change), constants, constants, and so on are defined.This is not confusing.
Example:
//Define a constructor method for our class.
//Use it to initialize properties that will be different
//Each individual Circle object.
FunctionCircle (x, y, r)
{
This. X=X;//The X-coordinate of the center of the circle
This. Y=Y;//The Y-coordinate of the center of the circle
This. R=R;//The radius of the circle
}
//Create and discard an initial Circle object.
//This forces the prototype object to be created in JavaScript 1.1.
NewCircle (0,0,0);
//Define a constant: a property that will be shared
//All circle objects. Actually, we cocould just use Math. PI,
//But we do it this way for the sake of instruction.
Circle. prototype. pi=
3.14159;
//Define a method to compute the circumference of the circle.
//First declare a function, then assign it to a prototype property.
//Note the use of the constant defined above.
FunctionCircle_circumference (){Return
2
*
This. Pi*
This. R ;}
Circle. prototype. circumference=Circle_circumference;
//Define another method. This time we use a function literal to define
//The function and assign it to a prototype property all in one step.
Circle. prototype. area=
Function(){Return
This. Pi*
This. R*
This. R ;}
//The Circle class is defined.
//Now we can create an instance and invoke its methods.
VarC=
NewCircle (0.0,0.0,1.0);
VarA=C. area ();
VarP=C. circumference ();
The prototype of the built-in class.
Not only can custom classes have prototype, but also built-in classes such as String and Date. You can also add new methods and attributes to them.
The following code adds a useful function to all String objects:
//Returns true if the last character is c
String. prototype. endsWith=
Function(C ){
Return(C=
This. CharAt (This. Length-1))
}
Then we can call it like this:
VarMessage=
"Hello world";
Message. endsWith ('H ')//Returns false
Message. endsWith ('D ')//Returns true