JavaScript Object-oriented programming function is also a class _js object-oriented

Source: Internet
Author: User
But there is no class concept in JavaScript, the so-called class is also simulated, through the function of the closure to simulate the class members and private members (for closures can see crossing boundaries: Closures)。 Here we will look at the "class" in JavaScript in a more down-to-earth way, bypassing some of the blunt principles.

Since you are using function to simulate a class, write code to create a keyword for the class or a function. We create a block punctuation class.

    function Point () {
      This. X = 0;
      This. Y = 0;
    };
 
  
    New Point ();
    Alert (")");

We all know that the access of Non-static class members needs to be done through objects, so a point type object is created first, and then the x and y axis coordinates are accessed through the object. Syntactically, JavaScript object creation process is similar to C #, but the implementation mechanism is not the same. Here's new creates an object, which points to this new object object when the subsequent point () function executes. The this.x and This.y in point are two public members of the point class, so objects of point can be accessed directly from them.

When it comes to members of class members or objects, it is unavoidable to mention accessibility issues. In JavaScript classes, there are also public and private members, but the details are different. JavaScript Private members are also members who are not allowed to manipulate objects outside of the class, but private members can also be accessed within the class's internal members. Within the class generally only private members and private members can access each other, you can think that the other members of the authority is not enough to operate these private things, but if you have privileges, it is not the same, the private public replicable it is not mistaken. A private member variable is like a normal variable declaration, with the VAR keyword, a private method can declare a variable with Var to receive a method object, or it can be constructed like a normal method.

    function Lady () {
      var age = 30;
      "Cauliflower";
      function () {
        Alert ("old.") ");
      };
      
      function Fancy () {
        Alert ("Fantasy becomes 20 years old.") ");
      };
      function () {
        Alert (", 20 years old.") ");
      };
    };
    New Lady ();
    alert (younglady.age); //Results undefined
    does not support
    does not support

The above is a lady class, age, find, fancy are all private members, and the fancy method can access the age and Name,think and fancy two methods can also call each other. But they are private, so the Younglady object created cannot be invoked to age, feel, and fancy, and certainly not to name. If private members can only call each other, they also lose the meaning of the existence of private members. JavaScript provides privileged members with the power to build bridges between outside and private members. A privileged member is a public member, and a public member has an ordinary public member, a privileged member, and an object public member.

Privileged members are in the class with this. XX's way to establish members, they can be invoked through objects, they can also access private members, you can establish a private member access to the channel.

    function Lady () {
      var age = 30;
      "Cauliflower";
      function () {
        Alert ("old.") ");
      };
      function Fancy () {
        Alert ("Fantasy becomes 20 years old.") ");
      };
      function () {
        Alert ("old.") ");
      };
    };
    New Lady ();
    Introduce

The creation of ordinary public members is not encoded inside the class, but is created by the prototype of the class. Adding ordinary public members is added directly to the prototype of the class, and prototype is a member set object like a JSON object. When we do object creation, it is assumed that the members in the class prototype will be automatically copy into the new Object object.

 var younglady = new Lady ();   
 Younglady. Introduce ();
 //introduce  
  
 Lady.prototype.Hobby =  "internet";  
 Lady.prototype.GetName = function () { 
 this.
 Name;   
 
 
 var lady2 = new Lady ();   
 alert (lady2.
 GetName ()); 
 alert (lady2.
Hobby); 

The above code adds the ordinary public member GetName method and the hobby attribute to the Lady class by prototype, because it is a public member, so they can be accessed with the privileged members originally intended for the class. Because public members can access each other. Make some changes to the above code. As follows.

 var younglady = new Lady (); 
  
   
 Lady.prototype.Hobby =  "internet";  
 Lady.prototype.GetName = function () { 
 this.
 Name;   
}; 
  
 alert (Younglady.
 GetName ()); 
 alert (Younglady.
Hobby); 

Create the Lady object first, then modify the class member, and the previously created object also has a new member. This is the benefit of prototype as a class prototype, where it is easy to understand that prototype is a template for class objects, and that modifications to the template affect all of those objects.

When you add a regular member, you can also add a batch, directly with a new JSON object to assign to the prototype. Note, however, that the original prototype is now replaced and the object created before the replacement is referenced by the old prototype object, so the object created before the replacement of prototype will not have hobby and getname members.

    Lady.prototype = {
      "Internet",
      function () {
        This. Name;
      }
    };
    New Lady ();
    Alert (Younglady. GetName ());
    Alert (Younglady. Hobby);

In addition to adding public members when building classes, you can also directly perform member operations on objects. This is described in the second article in this small series. In addition, the members that are added directly to the object are also public members that can be accessed with the public members that were previously in the class.

 Younglady. SetName = function (name) { 
 this.
 name = name;  
 
 Younglady.
 SetName ( "vegetable Ming");  
 alert (Younglady.
GetName ()); 

Above said the class member's thing, next time says the class inheritance related thing. (Please correct me if you have any improper remarks)

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.