The role of the prototype property:
Use the prototype property to provide a set of basic functions for the object's class. The operation of the new instance of the object, "inherit", gives the object a prototype.
features of the prototype property:
All JavaScript internal objects have read-only prototype properties. You can add functionality to the prototype of an internal object, but the object cannot be assigned a different prototype.
However, user-defined objects can be assigned to a new prototype.
the role of the constructor property:
constructor represents the function that created the object.
features of the constructor property:
The constructor property is a member of all objects that have prototype. They include all JavaScript internal objects except the Global and Math objects.
The constructor property holds a reference to a function that constructs a particular object instance.
A use prototype to add an object's properties [way one]
Example:
Copy Code code as follows:
<script type= "Text/javascript" >
Way One
var myobj = function () {
This.study = "JavaScript";
}
MyObj.prototype.hobby = function ()
{
This.hobby = "Girl";
}
var newObj = new MyObj ();
for (Var attr in NEWOBJ)
{
document.write (attr + "<br/>");
}
</script>
B add an object's properties using prototype [mode two]
Example:
Copy Code code as follows:
<script type= "Text/javascript" >
Mode two
var superobj = {name: "Xugang"};
var subobj = {age:20};
function Extend (superobj,subobj) {
Get the prototype object of the parent object
Subobj.getsuper = Superobj.prototype;
To give the properties of a parent object to child objects
for (var i in superobj) {
Subobj[i] = Superobj[i];
}
}
Extend (superobj,subobj);
For (var s in subobj)
{
document.write (S + "<br/>"); Traversing the properties of child objects
}
</script>
C using prototype to inherit the prototype properties of the parent class
Example:
Copy Code code as follows:
<script>
function Person (_name) {
THIS.name = _name;
}
creating objects (for changing prototype prototype objects)
function Addsex (_sex) {
This.sex = _sex;
}
To change a prototype object
Person.prototype = new Addsex (' Male ');
var p = new Person (' Xugang ');
Alert ("P's prototype is:" + p.constructor);
Print all Properties
for (var i in P) {
Alert (P[i]);
}
================= Inheritance =================
Creating child Objects Student
function Student (_study) {
This.study = _study;
}
Let Student inherit person through prototype
Student.prototype = new Person (' Andy Lau ');
var stu1 = new Student (' JS ');
Alert ("STU1 's prototype is:" + stu1.constructor);
for (var i in stu1) {
Alert (Stu1[i]);
}
</script>
Because the prototype of the Student object is changed to the person object, and the person object's prototype is changed to Addsex, the Student object's prototype is addsex.
Note: The prototype of an object is determined at the moment of the new object, if the change is not valid after the new object!
D How to set the object's prototype object and constructor
Example:
Copy Code code as follows:
<script type= "Text/javascript" >
function B () {
THIS.name = "Andy Lau";
Return "B method";
}
function C () {
This.age = 42;
Return "C Method";
}
B.prototype = new C ();
var B = new B ();
B.constructor = B; The construction method of overriding B is the B itself
document.write ("B's Construction Method:");
document.write (B.constructor () + "<br/>");
document.write ("B's Prototype object construction method:");
document.write (B.constructor.prototype.constructor () + "<br/>");
For (var m in B)
{
document.write ("attribute:" + m);
document.write ("Value:" + b[m] + "<br/>");
}
</script>
The results are as follows:
The construction method of B: Method B
The construction method of the prototype object of B: C method
Properties: Age Value: 42
Properties: Name value: Andy Lau
The __proto__ variable used to hold the prototype in the E object
Example:
Copy Code code as follows:
<script type= "Text/javascript" >
function MyObject () {}
var my = new MyObject ();
Any object will have a hidden __proto__ variable to save the prototype
document.write (my.__proto__ + "<br/>");
Displayed under Internet Explorer as: undefined
Shown under Mozilla Firefox: [Object Object]
function person () {
THIS.name = "Andy Lau";
Return to "person method";
}
/*
After the method is defined, the equivalent in memory:
Person.prototype = {Constructor:person}
*/
Change the prototype object of the Person object
function Super_person () {
This.hobby = "singing";
Return "Super_person method";
}
Person.prototype = new Super_person ();
var newObj = new Person ();
/* Create object procedure using new:
var o = {};
Person.prototype.constructor.call (o);
o = {__proto__:person.prototype,name = "Andy Lau"};
return o;
*/
document.write (NewObj.constructor.prototype.constructor () + "<br/>");
Print newobj prototype object (invalid under IE!) )
document.write (Newobj.__proto__.constructor () + "<br/>");
</script>
The results in Firefox are as follows:
[Object]
Super_person method
Super_person method