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

• Block-level scope, in some places it is called Private scope. There is no block-level scope in JavaScript. For example:

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!