JavaScript anonymous self-executing function ~function(){}

Original blog: https://blog.csdn.net/yaojxing/article/details/72784774

1. Common scenarios for anonymous functions

Anonymous functions in js are a very common function type, and the more common scenarios are:

 

[html]  view plain copy  

 

1.    <input type="button" value="点击" id="btn">    
2. <script type="text/javascript">  
3.     //The first case of anonymous function  
4.     var btn=document.querySelector("#btn");  
5.     btn.onclick=function(){  
6.         // alert("aaaaa");  
7.     }  
8.     //Second case of anonymous function  
9.     setInterval(function(){  
10.         // alert("bbbbb");  
11.     }, 1000);  
12.     //The third case of anonymous function  
13.     var fun=function(){  
14.         alert("ccccc");  
15.     }  
16.     // fun();  
17.     //The fourth case of anonymous function  
18.     var  obj={  
19.         name:"dddd",  
20.         say:function(){  
21.             alert(this.name);  
22.         }  
23.     }  
24.     obj.say();  
25. </script>  

The above shows the common usage scenarios of anonymous functions. (Note: querySelector is a new method for finding dom elements in H5)

2. Anonymous self-executing functions

As the name suggests, an anonymous self-executing function is first an anonymous function, but this function can be executed automatically without the help of other elements.

[html]  view plain copy  

 

1.   <input type="button" value="点击" id="btn">    
2. lt;script type="text/javascript">  
3. //1, the first implementation of anonymous functions  
4. (function(data){  
5.     // alert(data);  
6. })("eee");  
7. //2. The second implementation of anonymous self-executing functions  
8. (function(){  
9.     // alert("fff");  
10. }());  
11. //3. The third implementation of anonymous self-executing functions  
12. !function(data){  
13.     // alert(data);  
14. }("hhh");  
15. //4. The fourth implementation of anonymous self-executing functions  
16. var fun=function(data){  
17.     alert(data);  
18. }("iii");  

From the above code block, we can conclude that there are generally four ways to implement anonymous self-executing functions.

3. The role of anonymous self-executing functions

1. The most common use of anonymous self-executing functions is to implement closures. I will introduce the concept of closure in detail in a later blog. Here is a brief description of the closure. Closure: Closure is a feature of js, we can realize the connection inside and outside the function through the closure, and can make the local variables of the function always exist in memory.

 

2. Anonymous self-executing functions can also be used to simulate the creation of block-level scopes in js, that is, if an anonymous self-executing function is used to wrap some code, the effect of block-level scope can be achieved, reducing the number of global variables. After the execution of the self-executing function, the variable will be released by the memory, which will also save memory.

 

4. Summary of anonymous functions and anonymous self-executing functions

Anonymous functions can be simply understood as functions without names. There are 4 common scenarios in total.

Anonymous self-executing functions can be simply understood as anonymous functions that can be executed by themselves. There are four ways to implement anonymous self-executing functions.

The role of anonymous self-executing functions is to be used for both closure and creation of independent namespaces.