JavaScript based on prototype objects (create, invoke) _js object oriented

Source: Internet
Author: User
There are three of objects in JavaScript
1, internal objects
such as array,boolean,data,math,number,object,regexp,string objects, etc.
These object systems provide us with their own properties and methods for invocation.
2, class-based objects
Implements references to objects in the form of classes that require our own definition
3, based on the prototype object
Provides guidance on how to use JavaScript-based object models, and provides links to specific information describing custom constructors and inheritance for prototype based objects.

When we write the JS code, internal objects are unavoidable to reference, but it is not enough to rely on these objects, so we need to define our own objects, this time the most commonly used object is the third, that is, based on the prototype object, the following on how to create their own objects, define the object's methods, attributes, The calling object gives a detailed description.
Copy Code code as follows:

One of the powerful features of JScript is the ability to define constructors to create customized, prototype-based objects for use in your scripts.
To create an instance of a prototype-based object, you must first define a constructor.
This procedure creates a new object and initializes it (creates the property and assigns the initial value).
When finished, the constructor returns a reference to the constructed object.
Inside the constructor, the object created is referenced through the this statement.
function people (name,age)//Define People Object
{
this.mname=name;//here the mname represents the attribute, without being defined outside, this indicates the People object
This. Age=age;
this.category= "Mammals";
this.tostring=exporting;//method, note that only ToString can be written here, not ToString ()
This.mymethod=function ()//is equivalent to This.mymethod=method; then the method is written below
{
return "Hello";
}
}
function exporting ()//can have a return value, but the type of the return value is not written before the function name, such as String,int
{
Return "My name is--" +this.mname+ ", Age is--" +this. Age;
}
/*function method ()
{
return "Hello";
}*/
People.prototype.getname=function ()//write method outside the constructor,
You can also write function people.prototype.getName ()
Equivalent to the method inside the constructor: This.getname
{
return this.mname;
}
People.prototype.getage=this. Age;//writes properties Outside of the constructor,
Equivalent to the method inside the constructor: This.getage
function People.prototype.getMoney ()//people.prototype.getmoney=function () equivalent
Also equivalent to the wording in the constructor: This.getmoney
{
return "1000";
}
function Show ()//Call People Object
{
var me=new people ("Andy Lau", 22);//Instantiate People object, keyword new
var myname=me.getname ();
alert (myname);
me.sex= "male"; the sex property here can only be used with the instance of me, which is a unique property
And if there is a definition of var you =new people ("cockroach", 1);
This instance cannot invoke the Sex property
If you want these two instances to be referenced, you should write the sex attribute People.prototype.sex
alert (me.sex);
alert (me.category);
Alert (me.tostring ()),//or Direct write alert (Me)
Alert (Me.mymethod ());
Alert (Me.getmoney ());
Alert (Me.mymethod () + "\ n Name:" +me.getname () + "\ n Sex:" +me.sex+ "\ n Category:" +me.category+ "\ n Total Assets:" +me.getmoney () + "Summary:" + Me.tostring ());
}

Depending on the idea above, you can add additional properties or methods to the JavaScript built-in object, and the following string object adds a
Good methods and bad properties, which are methods and properties that are not in the built-in objects
Copy Code code as follows:

String.prototype.good=function ()//custom method
{
Return "Congratulations on your successful append good method to the built-in string object";
}
String.prototype.bad= "Congratulations on your success. Append bad property to built-in string object;//Custom properties
function test ()//Call property and method appended by string object
{
var str= "good Good Study";//define a String instance str
Alert (Str.good () + "\ n" +str.bad);//Calling Method good and properties of a custom string object bad
}

Finally, add two button buttons in HTML to test the methods and properties appended by object people and string objects
Copy Code code as follows:

<title>javascript object based on prototype </title>
<body>
<div>
<input type= "button" value= "custom object Definition" onclick= "show ()" >
</div>
<div>
<input type= "button" value= "built-in object Append method" onclick= "Test ()" >
</div>
</body>

Test results passed ..... Indicates the creation of the object, the invocation of the object method property, the Append method of the inner object, and the property call are correct.
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.