Some sample methods inherited in JavaScript and attribute reference _javascript tips

Source: Internet
Author: User
Tags extend object object
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
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.