Home > Article > Web Front-end > What is the name of a function without a name in javascript?
In JavaScript, a function without a name is called an "anonymous function", and the syntax is "function (){}". The functions of anonymous functions: 1. Closure can be realized through anonymous functions; 2. Simulate block-level scope and reduce global variables.
The operating environment of this tutorial: Windows 7 system, ECMAScript version 6, Dell G3 computer.
Anonymous function: A function without an actual name.
First we declare a normal function:
//声明一个普通函数,函数的名字叫fn function fn(){ console.log("hello world"); }
Then remove the name of the function to become an anonymous function:
//匿名函数,咦,运行时,你会发现报错啦! function (){ console.log("hello world"); }
At this point, you will find that running a separate The anonymous function reports an error because it does not meet the syntax requirements! The solution is just to wrap the anonymous function with a bracket:
//匿名函数在其它应用场景括号可以省略 (function (){ //由于没有执行该匿名函数,所以不会执行匿名函数体内的语句。 console.log("hello world"); })
If you need to execute the anonymous function, add a bracket after the anonymous function to execute it immediately!
(function (){ //此时会输出hello world console.log("hello world"); })()
If you need to pass a value, just write the parameters directly within the brackets:
(function (str){ //此时会输出hello world! console.log("hello"); })(" world!")
[Recommended learning: javascript advanced tutorial]
Application scenarios of anonymous functions
1, event
<input type="button" value="点我啊!" id="sub"> <script> //获得按钮元素 var sub=document.querySelector("#sub"); //给按钮增加点击事件。 sub.onclick=function(){ alert("当点击按钮时会执行到我哦!"); } </script>
2, object
var obj={ name:"张三", age:18, fn:function(){ return "我叫"+this.name+"今年"+this.age+"岁了!"; } }; console.log(obj.fn());//我叫张三今年18岁了!
3, function expression
//将匿名函数赋值给变量fn。 var fn=function(){ return "我是一只小小小小留下,怎么飞也飞不高!" } //调用方式与调用普通函数一样 console.log(fn());//我是一只小小小小留下,怎么飞也飞不高!
4, Callback function
setInterval(function(){ console.log("我其实是一个回调函数,每次1秒钟会被执行一次"); },1000);
5, return value
//将匿名函数作为返回值 function fn(){ //返回匿名函数 return function(){ return "hello world"; } } //调用匿名函数 console.log(fn()());//hello world //或 var box=fn(); console.log(box());//hello world
Imitate block-level scope
if(1==1){//条件成立,执行if代码块语句。 var a=12;//a为全局变量 } console.log(a);//12 for(var i=0;i<3;i++){ console.log(i); } console.log(i);//4
if(){}for(){}, etc. do not have their own scope. If it goes out of its own scope, the declared variable will be destroyed immediately. But we can simulate block-level scope through anonymous functions:
(function(){ //这里是我们的块级作用域(私有作用域) })();
Try block-level scope:
function fn(){ (function(){ var la="啦啦啦!"; })(); console.log(la);//报错---la is not defined } fn();
The role of anonymous functions:
1. Closure can be implemented through anonymous functions. Closure will be explained in the following articles. A quick introduction here: a closure is a function that can access variables defined within the function scope. To create a closure, you often need to use an anonymous function.
2. Simulate block-level scope and reduce global variables. After executing the anonymous function, the corresponding variables stored in the memory will be destroyed, thereby saving memory. Furthermore, in large-scale multi-person development projects, using block-level scope will greatly reduce the problem of naming conflicts, thereby avoiding catastrophic consequences. Developers no longer have to worry about messing up the global scope.
For more programming-related knowledge, please visit: Programming Video! !
The above is the detailed content of What is the name of a function without a name in javascript?. For more information, please follow other related articles on the PHP Chinese website!