Javascript note (1)

Source: Internet
Author: User
Tags hasownproperty

Javascript object-oriented programming:
VaR cat = {

Name = '';
Color = '';
}
 
VaR cat1 = {};
Cat1.name = "Mao ";
Cat1.color = "yellow ";

VaR cat2 = {};
Cat2.name = "ermao ";
Cat2.color = "black ";

Changes to the original mode:
Function CAT (name, color ){

Return {
Name: Name,
Color: Color

}
}
Generate an instance object:
VaR cat1 = CAT ("Big Hair", "yellow ");
VaR cat2 = CAT ("two hairs", "black ");

Constructor mode:
Function CAT (name, color) {// use the constructor
This. Name = Name;
This. Color = color;
}
VaR cat1 = new CAT ("Da Mao", "yellow ");
VaR cat2 = new CAT ("two hairs", "black ");
Alert (cat1.name); // damao
Alert (cat2.color); // black
However, the constructor mode wastes memory.

Prototype mode: defines unaltered letters and methods on prototype objects.
Function CAT (name, color ){
This. Name = Name;
This. Color = color;
}
Cat. Prototype. type = "cat ";
Cat. Prototype. Eat = function () {alert ("Eat mouse ")};
Generate an instance:
VaR cat1 = new CAT ("Da Mao", "yellow ");
VaR cat2 = new CAT ("two hairs", "black ");

Alert (cat1.type );
Cat1.eat ();

Isprototypeof () determines the relationship between a prototype and an instance.

Hasownproperty () determines whether a prototype and a property are local attribute examples.
For example, alert (cat1.hasownproperty ("name"); the result is true.

In OPERATOR: determines whether an instance contains an attribute.
Alert ("name" in cat1) L; // true
The in operator can also be used to traverse all attributes of an object.
For (VAR prop in cat1) {alert ("cat1 [" + Prop + "] =" + cat1 [prop])}

How to generate an instance that inherits multiple objects:
Constructors of existing animal objects:
Function animal (){
This. Species = "animal ";
}

There is also a cat object constructor,
Function CAT (name, color ){
This. Name = Name;
This. Color = color;
}
How Can cats inherit animals?
1. bind with constructor: Use the call and apply methods to bind the constructor of the parent object to the sub-object.
Function CAT (name, color ){
Animal. Apply (this, argumengts );
This. Name = Name;
This. Color = color;
}
VaR cat1 = new CAT ("Da Mao", "yellow ");
Alert (cat1.species); // animal
2. More common methods: Prototype Mode
For example, if the prototype object of a cat points to an animal instance, the animal can be integrated.
Cat. Prototype = new animal ();
Cat. Prototype. construtor = cat;
VaR cat1 = new CAT ("Da Mao", "yellow ");
Alert (cat1.species); // animal
3. inherit prototype directly
Since the unchanged attributes can be directly written to prototype, let CAT () directly inherit animal. Prototype;
Function animal (){}
Animal. Prototype. specoes = "animal ";
Cat. Prototype = animal. Prototype;
Cat. Prototype. construtor = cat;
VaR cat1 = new CAT ("Da Mao", "yellow ");
Alert (cat1.species); // animal
In this way, the prototype of animal is also changed, so it is defective,
4. To solve this problem, we use an empty object as an intermediary,
VaR F = function (){}
F. Prototype = animal. Prototype;
Cat. Prototype = new F ();
Cat. Prototype. construtor = cat;
Alert (animal. Prototype. construtor); // animal
5. encapsulation functions in prototype mode
The above method is encapsulated into a function for ease of use.
Function extend (child, parent ){
Car F = function (){};
F. Prototype = parent. Prototype;
Child. Prototype = new F ();
Child. Prototype. construtor = child;
Child. Uber = parent. Prototype;

}
The method for using this function is as follows:
Extend (CAT, animal );
VaR cat1 = new CAT ("Da Mao", "yellow ");
Alert (cat1.specoes );
6. Copy inheritance
If all attributes of the parent object and the French method are copied to the sub-object, inheritance can also be realized.

Function animal (){}
Animal. Prototype. Species = "animal ";
Function extends (child, parent ){
VaR P = parent. Prototype;
VaR c = Child. Prototype;
For (car I in P ){
C [I] = P [I];
}
C. Uber = P;
} Write it like this when using it.
Extends (CAT, animal );
VaR cat1 = new CAT ("Da Mao", "yellow ");
Alert (cat1.species); // animal

Next we will not use constructors to implement inheritance.
VaR Chinese = {nation: 'China '}
VaR doctor = {carrer: 'Doc '}
How can doctors Inherit Chinese people,
Object () method:
Function object (o ){
Function f (){}
F. Prototype = O; // point the prototype attribute of the Child object to the parent object to connect it together,

Return new F ();
}
Usage
VaR doctor = Object (Chinese );
Doctor. Career = "doctor"; // Add attributes of sub-objects
Alert (doctor. Nation); // Chinese
There is also a method: shallow copy
The following function is copied:
Function extendcopy (p ){
VaR c = {};
For (var I in P ){
C [I] = P [I];
}
C. Uber = P;
Return C;

}
Write as follows:
VaR doctor = extendcopy (Chinese );
Doctor. Career = "doctor ";
Alert (doctor. Nation); // China

There is a problem that the sub-object is only a memory address, not a real copy, which will change the value of the parent object.
Deep copy:
Even if you can copy arrays and objects in the true sense,
Function deepcopy (p, c ){
VaR v = C || {};
For (var I in P ){

If (typrof P [I] = 'object '){
C [I] = (P [I]. construtor = array )? []: {
} Else {
C [I] = P [I];
}
Return C;
}

}
When using:
VaR doctor = deepcopre (Chinese );
Chinese. bithplace = ['beijing', 'shanghai', 'xiamen '];
Doctor. Birthplace. Push ('Hong Kong ');
In this way, the parent object will not be affected,
Alert (doctor. Birthplace); // Beijing, Shanghai, Xiamen, Hong Kong
Alert (Chinese. Birthplace); // Beijing, Shanghai, Xiamen

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.