Encapsulation in JavaScript
To put it simply, encapsulation allows the outside world to only access common variables and functions of objects, hiding details and data.
There are three ways to create objects in js, namely, three types: portal opening, naming specifications to distinguish private variables, and closures to create real private variables.
1. The portal is open, which is the most basic method to implement objects. All methods and variables are shared by the outside world to access.
var Book = function(name){ if((name)){ ("error"); throw new Error("name null"); } = name; } = { check:function(name){ if(!name){ return true; } }, getName:function(){ return ; } } var book = new Book("Ha ha"); //output: Haha Haha(,());
This example is a typical example of a large-scale portal, where the outside world can directly access the properties and methods of the object. You can notice that both properties and variables have "this" to create.
2. Use naming specifications to distinguish private variables. This method is an optimized version of the portal, but it is just used to distinguish private variables or methods with "_" in front of private variables or methods. If a programmer deliberately uses the _getName() method to call the method, it still cannot be stopped, and it is not really hiding the variable.
3. The closure creates a real private variable. This method takes advantage of the characteristics of only functions in js that have scope and defines related variables in the scope of the constructor. These variables can be accessed by all functions in the scope of the definition domain.
var Book2 = function(name){ if(check(name)){ ("error"); throw new Error("name null"); } name = name; function check(name){ if(!name){ return true; } } = function(){ return name; } } = { display:function(){ //No direct access to name return "display:"+(); } } var book2 = new Book2("Ha ha"); //output:undefined "Haha" "display:Haha"(,(),());
You can see that the result in this example, directly accessing the name will return the undefined result. You can see the difference between this example and the portal open type. The variables in the portal open type are created using "this", while in this example, var is used to create. The same is true for check function, so that the name and check functions can only be accessed in the scope of the constructor and cannot be directly accessed by the outside world.
This method solves the problems of the first two methods, but it also has certain disadvantages. In the portal open object creation mode, all methods are created in the prototype object, so no matter how many object instances are generated, these methods only have one copy in memory. With this method, each new object generated will create a new copy for each private variable and method, so it will consume more memory.
Inheritance in JavaScript
Book base class:
var Book = function(name){ if((name)){ ("error"); throw new Error("name null"); } = name; } = { check:function(name){ if(!name){ return true; } }, getName:function(){ return ; } }
Inheritance method:
function extend(subClz,superClz){ var F = function(){} = ; = new F(); = subClz; = ; if( == ){ = superClz; }
Using the empty function F as a bridge can avoid the additional overhead of calling the parent class constructor when directly instantiating the parent class. Moreover, when the parent class constructor has parameters, it is not possible to directly implement the call of the parent class constructor and the inheritance of the prototype chain through = new superClass();.
= ; if( == ){ = superClz; }
Adding these three sentences can prevent the subclass from inheriting the parent class from writing (this, name); but simply writing (this, name) can be achieved.
And when the subclass rewrites the parent class method, the parent class method can be called:
= functiion(){ return (this) + "!!!"; }
ArtBook subclass:
var ArtBook = function(name,price){ (this,name); = price; } extend(ArtBook,Book); = function(){ return ; } = function(){ return (this)+"!!!"; }