An application of Javascript anonymous functions Code encapsulation

An application of Javascript anonymous functions Code encapsulation_javascript skills

WBOY

Release： 2016-05-16 18:24:21

Original

925 people have browsed it

You can see this writing style in some Javascript libraries:

Copy code The code is as follows:

 
( function(){ 
//All library code codes 
})(); 

To be honest, for me, a js beginner. This thing is so scary. In these JS libraries, this function basically encloses all the code in the entire library. This way of writing completely surpasses my common sense. Shouldn't it be divided carefully? Shouldn't it reflect the division of levels and functions? How can it be done with one function? I didn't dare to think about it at all at first. It wasn't until after using JS for a while that a colleague mentioned this issue in a casual chat one day that I knew this was called an anonymous function. I am no stranger to anonymous functions. They are available in C#, Python, and Lua. I checked it online and found many introductory articles that were very detailed, but the question in my mind was not answered: Why should I write it like this?
I found a well-known JS open source library JQuery, and its code is the typical writing method mentioned above. After a rough look at his code, I found that this code is too big and complicated, and it is really not suitable for me. So I turned to another open source js library, swfobject, which provides a simple interface to embed Flash controls into web pages. This code is much better, very short and can be read quickly. After reading it, I suddenly realized that this was the case. The truth is so simple, and the reason why it is written like this is for only one purpose: encapsulation.
When I first learned JS, I asked my colleagues how to define private functions and variables in JS. The answer I got at that time was: js is not object-oriented and does not provide these functions. I accepted this answer calmly, after all, strict encapsulation is not necessary. Now I finally understand that there is always a way, and encapsulation can also be achieved in languages that do not support encapsulation. The way to achieve this is through anonymous functions. Let’s look at a piece of code:

Copy code The code is as follows:

 
//Definition of 
function F(x) 
{ 
this.x = x; 
function double(x){return x*x;} 
this.getDoubleX(){ 
return double(this.x ); 
} 
} 

//Use 
f = new F(12); 
alert(f.getDoubleX()); 

The above code is very simple, I did not run it. Anyone who knows a bit about JS knows that this is the way JS class is defined. Function F is equivalent to a constructor, and other definitions in the function are private and inaccessible to the outside, such as the double function. In this way, the private method is implemented in disguise. Other members prefixed with "this." are equivalent to public members and can be accessed by the outside world.
The reason why these libraries wrap the entire library code with a large function is to not expose internal methods and variables to users, forcing users to only access open APIs. From this we can see the good intentions of these developers.
At this point I can’t help but ask again, how does js implement inheritance. I hope the answer this time won’t be like last time: no support.