Home > Developer > JavaScript
Javascript defines objects in six ways:
1.1 add attributes to an existing object
<! Doctype html public "-// W3C // dtd html 4.01 Transitional // EN"
Http://www.w3.org/TR/html4/loose.dtd>
<Html xmlns = "http://www.w3.org/1999/xhtml">
<Head>
<Meta http-equiv = "Content-Type" content = "text/html; charset = UTF-8"/>
<Title> New Web Project </title>
</Head>
<Script type = "text/javascript">
// Extend attributes with existing objects
Var object = new Object ();
Object. name = "zhangsan ";
Object. sayName = function (name ){
This. name = name;
Alert (this. name );
}
Object. sayName ("lisi ");
</Script>
</Html>
1.2 create objects in factory Mode
<Script type = "text/javascript">
// Create an object in factory Mode
Function createObject (){
Var object = new Object ();
Object. username = "hw ";
Object. password = "810068 ";
Object. get = function (){
Alert (this. username + "," + this. password );
}
Return object;
}
Var object1 = createObject ();
Var object2 = createObject ();
Object1.get ();
</Script>
<Script type = "text/javascript">
// Create an object in factory Mode
Function createObject (name ){
Var object = new Object ();
Object. username = name;
Object. password = "81 ";
Object. get = function (){
Alert (this. username + "," + this. password );
}
Return object;
}
Var object1 = createObject ("Huang Wei ");
Var object2 = createObject ("Fu pan ");
Object1.get ();
</Script>
How to share a function object with multiple objects, instead of having one function object for each object?
Method: place the function outside. See the following code:
<Script type = "text/javascript">
// Create an object using the factory Method
/* Share a function object with multiple objects, instead of having one function object for each object: Put the method out */
Function get (){
Alert (this. username + "," + this. password );
}
Function createObject (name, password ){
Var object = new Object ();
Object. username = name;
Object. password = password;
Object. get = get;
Return object;
}
Var object1 = createObject ("Huang Wei", "456 ");
Var object2 = createObject ("Suwon", "123 ");
Object1.get ();
</Script>
1.3 constructor method (using constructor)
<Script type = "text/javascript">
Function Person (){
// Before executing the first line of code, the js engine will generate an object for us
This. username = "hw ";
This. password = "root ";
This. getInfo = function (){
Alert (this. username + "," + this. password );
}
// There is a hidden return statement used to return the previously generated object.
}
Var person = new Person ();
Person. getInfo ();
</Script>
<Script type = "text/javascript">
Function Person (name, password ){
// Before executing the first line of code, the js engine will generate an object for us
This. username = name;
This. password = password;
This. getInfo = function (){
Alert (this. username + "," + this. password );
}
// There is a hidden return statement used to return the previously generated object.
}
Var person = new Person ("wei", "444 ");
Person. getInfo ();
</Script>
1.4 prototype
<Script type = "text/javascript">
Function Person (){
}
Person. prototype. username = "zhangsan ";
Person. prototype. password = "123 ";
Person. prototype. getInfo = function (){
Alert (this. username + "," + this. password );
}
Var person1 = new Person ();
Var person2 = new Person ();
Person1.username = "yellow ";
Person1.getInfo ();
Person2.getInfo ();
</Script>
Objects defined simply using the prototype cannot assign initial values to properties in the constructor. The attribute values can only be changed after the object is generated.
Defect of this method: attributes are shared among multiple objects.
1.5 prototype + constructor Mode
<Script type = "text/javascript">
Function Person (){
This. username = new Array ();
This. password = "123 ";
}
Person. prototype. getInfo = function (){
Alert (this. username + "," + this. password );
}
Var p = new Person ();
Var p2 = new Person ();
P. username. push ("Huang Wei ");
P2.username. push ("sujie ");
P. getInfo ();
P2.getInfo ();
</Script>
1.6 Dynamic Prototype
<Script type = "text/javascript">
// C: \ Documents ents and Settings \ Administrator \ My Documents ents \ Aptana Studio Workspace \ js00001 \ javascript002.html
/* Use a dynamic prototype */
Function Person (){
This. username = new Array ();
This. password = "123 ";
If (typeof Person. flag = "undefined "){
Alert ("invoked ");
Person. prototype. getInfo = function (){
Alert (this. username + "," + this. password );
}
Person. flag = true;
}
}
Var p = new Person ();
Var p2 = new Person ();
P. username. push ("Huang Wei ");
P2.username. push ("sujie ");
P. getInfo ();
P2.getInfo ();
</Script>
The preceding six methods are used to define objects in js.
Author "whuang"
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
