Javascript-object-oriented (2) Encapsulation

Write a small example:

Step 1: create a "Mobile Phone type"

 
VaRMobilephone = (Function(){
............
})()
 

 

 

Step 2: Consider the private attributes of these classes. Here I want to define the number of mobile phones that come out of the instance.

VaRMobilephone = (Function(){//Private attributesVaRCount = 0;//Number of mobile phones})()
 

 

 

Step 3: Create a constructor, that is, to initialize the new image, such as attribute and method initialization. In this example, each mobile phone will have a color, size, price attribute. here the constructor is also a closure, so you can access count and the value of count will be stored in the memory for a long time (as long as there is a reference)

VaRMobilephone = (Function(){//Private attributesVaRCount = 0; // Indicates the number of mobile phones

 

 

// Constructor
VaR creatphone = function (color, size, price ){
Count ++;
This. _ color = color; // cell phone color
This. _ size = size; // cell phone size
This. _ price = price; // mobile phone price
This. Index = count; // mobile phone index, which is the number of mobile phone images created
}

 

 
})()
 

 

 

Step 4: common methods:

That is, all the mobile phone objects from the instance can be used. Here, the mobile phone should be able to change the price, color, size, or display the size, color, and price.

The common methods here should be placed in the "prototype object:

1. All objects created using the constructor instance, that is, mobile phones, can use the methods in the "prototype object.

2. If it is placed in the constructor, a bunch of repeated methods will be generated every time a mobile phone object is displayed on the instance, occupying the memory.

3. "constructor": creatphone explanation:

 
Because creatphone. Prototype = {......} It overwrites the reference of the previous prototype object. To associate the prototype object with the constructor, set "constructor": creatphone.

 

 VaR Mobilephone = ( Function  (){  //  Private attributes         VaR Count = 0; //  Number of mobile phones  //  Constructor  VaR Creatphone = Function  (Color, size, price) {count ++ ;  This . _ Color = color; //  Mobile phone color  This . _ Size = size; // Phone size  This . _ Price = price; //  Mobile phone price  This . Index = count; //  Mobile phone index, which is the number of mobile phone pictures created  }  //  Public method, which is stored in the prototype object Creatphone. Prototype = { "Constructor" : Creatphone,  // Retrieve mobile phone color "Getcolor ": Function  (){  Return   This  . _ Color ;},  //  Set mobile phone color "Setcolor ": Function  (Color ){  This . _ Color = Color ;},  //  Get mobile phone size "Getsize ": Function  (){  Return "Width:" + This . _ Size. Width + "height:" + This  . _ Size. height ;},  //  Set mobile phone size "Setsize ": Function  (Size ){  This . _ Size. width = Size. width;  This . _ Size. Height = Size. height ;},  //  Get Mobile Phone price "Getprice ": Function  (){  Return   This  . _ Price ;},  //  Set the mobile phone price "Setprice ": Function  (Price ){  This . _ Price =Price }}})() 

Step 5: The privileged method requires a method that can be used to remove the private variables of the privileged class. It is the number of mobile phone objects that come out of the instance.

 
VaRMobilephone = (Function(){//Private attributesVaRCount = 0;//Number of mobile phonesVaRIndex = 0;//Mobile phone Index
 

// Constructor
VaR creatphone = function (color, size, price ){
Count ++;
This. _ color = color; // cell phone color
This. _ size = size; // cell phone size
This. _ price = price; // mobile phone price
This. Index = count; // mobile phone index, which is the number of mobile phone images created
}

 //  Public method, which is stored in the prototype object Creatphone. Prototype = { "Constructor" : Creatphone, "Getcolor ":Function  (){  Return   This  . _ Color ;}, "Setcolor ": Function  (Color ){  This . _ Color = Color ;}, "Getsize ": Function  (){  Return "Width:" + This . _ Size. Width + "height:" +This  . _ Size. height ;}, "Setsize ": Function  (Size ){  This . _ Size. width = Size. width;  This . _ Size. Height = Size. height ;}, "Getprice ": Function  (){  Return   This  . _ Price ;}, "Setprice ": Function  (Price ){  This . _ Price = Price }}  //  Privileged Methods Creatphone. get_count_index = Function  (){  Return  Count}  Return  Creatphone ;})() 

 

Use a mobile phone test encapsulated above

 

 VaR Anycall = New Mobilephone (); //  An instance of a Samsung mobile phone  VaR HTC = New Mobilephone (); //  Instance: an HTC mobile phone object  VaR Iphone4s = New Mobilephone (); //  Instance: An apple 4s mobile phone object Console. Log ("Samsung:" + anycall. index + ""); //  FF's console outputs the number of Samsung mobile phone objects created, that is, the index; Console. Log ("HTC is:" + HTC. index + "Platform "); //  FF's console outputs the number of HTC mobile phone objects created, that is, the index; Console. Log ("iphone4s number:" + iphone4s. index + ""); //  The FF console outputs the number of Apple 4s mobile phone objects created, that is, the index; Console. Log ("A total of" + mobilephone. get_count_index () + "Mobile Phone "); //  FF console outputs a total of several mobile phones; Console. Log (anycall. constructor === mobilephone ); //  Whether the constructor in the original image of the instance also points to mobilephone 

 

 

The results are as follows: