JavaScript prototype-based objects (creation and calling)

Source: Internet
Author: User

There are three types of objects in JavaScript:
1. Internal object
Such as Array, Boolean, Data, Math, Number, Object, RegExp, String Object, etc.
These object systems provide us with their respective attributes and methods for calling.
2. class-based Objects
Implement object reference using classes. We need to define these classes by ourselves.
3. Prototype-based Objects
Provides a guide on how to use JavaScript prototype-based object models and links to specific information that describes the custom constructors and Inheritance of prototype-based objects.

When writing js Code, internal objects are inevitable to be referenced, but these objects alone are not enough. Therefore, we need to define our own objects, in this case, the third type of objects is usually used, that is, prototype-based objects. The following describes how to create your own objects, define object methods and attributes, and call objects.
Copy codeThe Code is as follows:
// A powerful function of JScript is to define constructors to create custom prototype-based objects for use in your scripts.
// To create a prototype-based object instance, you must first define a constructor.
// This process creates a new object and initializes it (creates the attribute and assigns the initial value ).
// After completion, the constructor returns a reference to the constructed object.
// Within the constructor, the created object is referenced using the this statement.
Function people (name, age) // defines the people object
{
This. mName = name; // The mName here indicates the property and does not need to be defined outside. this indicates the object "people ".
This. Age = age;
This. category = "Mammal ";
This. toString = Exporting; // method. Note that you can only write toString instead of toString ()
This. myMethod = function () // equivalent to this. myMethod = method; then write the method below
{
Return "hello ";
}
}
Function Exporting () // you can return values, but you do not need to write the type of the return value before the function name, such as string or int.
{
Return "My name is --" + this. mName + ", Age is --" + this. Age;
}
/* Function method ()
{
Return "hello ";
}*/
People. prototype. getName = function () // write the method outside the constructor,
// You can also write function people. prototype. getName () in this way ()
// Equivalent to the method in the constructor: this. getName
{
Return this. mName;
}
People. prototype. getAge = this. Age; // write attributes outside the constructor,
// Equivalent to the method in the constructor: this. getAge
Function people. prototype. getMoney () // equivalent to people. prototype. getMoney = function ()
// It is also equivalent to the statement in the constructor: this. getMoney
{
Return "1000 ";
}
Function show () // call the people object
{
Var me = new people ("Andy Lau", 22); // instantiate the people object, keyword new
// Var myName = me. getName ();
// Alert (myName );
Me. sex = "male"; // The sex attribute here can only be used for the me instance, that is, the special attribute
// If var you = new people ("Xiaoqiang", 1) is defined );
// You cannot call the sex attribute.
// If both instances can be referenced, write the sex attribute into people. prototype. sex.
// Alert (me. sex );
// Alert (me. category );
// Alert (me. toString (); // or directly write alert (me)
// Alert (me. myMethod ());
// Alert (me. getMoney ());
Alert (me. myMethod () + "\ n name:" + me. getName () + "\ n Gender:" + me. sex + "\ n category:" + me. category + "\ n total assets:" + me. getMoney () + "\ n Summary:" + me. toString ());
}

Based on the above idea, you can add other attributes or methods to the JavaScript built-in object. Add one to the String object below.
Good method and bad attribute, which are not included in the built-in object
Copy codeThe Code is as follows:
String. prototype. good = function () // custom Method
{
Return "Congratulations, you have successfully added the good method to the built-in String object ";
}
String. prototype. bad = "Congratulations, you have successfully appended the bad attribute to the built-in String object"; // custom attribute
Function test () // call the attributes and Methods appended to the String object
{
Var str = "good study"; // defines a string instance str
Alert (str. good () + "\ n" + str. bad); // call the custom string object method "good" and "bad"
}

Add two buttons in html to test the append methods and attributes of the people and string objects.
Copy codeThe Code is as follows:
<Html>
<Title> JavaScript prototype-based object </title>
<Body>
<Div>
<Input type = "button" value = "custom object definition" onclick = "show ()">
</Div>
<Div>
<Input type = "button" value = "built-in object appending method" onclick = "test ()">
</Div>
</Body>
</Html>

The test result is passed ....... It indicates that object creation, object method property calling, internal object append method and attribute calling are all correct.

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.