JavaScript Essentials (top)

Execute function immediately

That is, immediately invoked function Expression (iife), as it is named, is executed as soon as the function is created. It does not bind any events, and it does not have to wait for any asynchronous operations:

(function () {    console.log ("js")}) ()

function () {...} is an anonymous function that encloses its pair of parentheses and converts it to an expression, followed by a pair of parentheses that calls the function. immediately executing a function can also be understood as calling an anonymous function immediately. The most common scenario for executing functions immediately is to limit the scope of the var variable to your function, which avoids naming conflicts.

Closed Package

For closures (closure), when an external function returns, the intrinsic function can still access the variables of the external function. Here's a more classic example.

 function F1 () { var  N = 0 ; //  n is a local variable of the F1 function   function F2 ()  //  F2 is the intrinsic function of the F1 function, which is the closure   {N  + = 1 ;       intrinsic function F2 uses the variable N   Console.log (n) in the external function F1;  return   F2;}  var  result = F1 (); result ();  //  output 1  result (); //  output 2  

In the code, the external function F1 executes only once, the variable N is set to 0, and the intrinsic function F2 is assigned to the variable result. Since the external function F1 has been executed, its internal variable n should be purged in memory, but it is not true: every time we call result , we find that the variable n is always in memory and is accumulating. Why is it? This is the magic of closures!

closures define private variables

JavaScript developers use underscores as a prefix for private variables. But in fact, these variables can still be accessed and modified, not the real private variables. In this case, a closure can be used to define a true private variable:

function Product () {varname;  This. SetName =function (value) {Name=value;    };  This. GetName =function () {returnname; };}varp =NewProduct ();p. SetName ("Fundebug"); Console.log (p.name); //output undefinedConsole.log (P.getname ());//Output Fundebug

In the code, the name property of the object p is a private property and cannot be accessed directly using p.name .

Prototype

Each JavaScript constructor has a prototype property that sets the properties and methods that all instance objects need to share. The prototype property cannot be enumerated. JavaScript only supports inheritance properties and methods through the prototype property.

function Rectangle (x, y) { This. _length =x;  This. _breadth =y;} Rectangle.prototype.getDimensions=function () {return{length: This. _length, Breadth: This. _breadth};};varx =NewRectangle (3,4);vary =NewRectangle (4,3); Console.log (X.getdimensions ()); //{length:3, breadth:4}Console.log (Y.getdimensions ());//{length:4, breadth:3}

In the code,x and y are the object instances created by the constructor Rectangle , which inherit the Getdimensions method through prototype.

Modular

JavaScript is not a modular programming language, at least ES6 before landing. For a complex web application, however, modular programming is a fundamental requirement. At this point, you can use the immediate execution function to achieve modularity, just as many JS libraries such as jquery and our fundebug are implemented.

varmodule =(function () {varN =5; function print (x) {Console.log ("The result is:"+x); } function Add (a) {varx = A +N;    print (x); }    return{description:"This is description", Add:add};}) (); Console.log (module.description); //Output "This is description"Module.add (5);//output "The result is:10"

Modularity is the control of the accessibility of properties and methods within the module, either private or public, as needed. In code, module is a stand-alone block,N is its private property,print is its private method,decription is its public property, andadd is its common method. This in many companies have a common library to store a lot of packaged good method functions, used up Shuangshuang!

JavaScript Essentials (top)