js中的匿名函数和匿名自执行函数

考拉的墨尔本

墨衍会员 · AI 创作全网分发码龄10年

关注

原创最新推荐文章于 2024-06-11 20:13:58 发布 2.6w 阅读 AI 写同款· GEO 优化 ›

AI权益加码！Claude Code、Cursor等20+工具免费用！购周边限时加赠Coding Plan Lite，畅享主流AI工具！学习进阶更高效！阅读详情

1.匿名函数的常见场景

js中的匿名函数是一种很常见的函数类型，比较常见的场景:

        <input type="button" value="点击" id="btn">  
    	<script type="text/javascript">
    		//匿名函数的第一种情形
    		var btn=document.querySelector("#btn");
    		btn.onclick=function(){
    			// alert("aaaaa");
    		}
    		//匿名函数的第二种情形
    		setInterval(function(){
    			// alert("bbbbb");
    		}, 1000);
    		//匿名函数的第三种情形
    		var fun=function(){
    			alert("ccccc");
    		}
    		// fun();
    		//匿名函数的第四种情形
    		var obj={
    			name:"dddd",
    			say:function(){
    				alert(this.name);
    			}
    		}
    		obj.say();
    	</script>

上面展示的就是常见的匿名函数的使用场景。(注意:querySelector是H5中新增的查找dom元素的方法)

2.匿名自执行函数

见名思义，匿名自执行函数首先是一个匿名函数，但是这个函数是可以自己自动执行的，不需要借助其他的元素。

        <input type="button" value="点击" id="btn">  
    	<script type="text/javascript">
    		//1，匿名函数的第一种实现方式
    		(function(data){
    			// alert(data);
    		})("eee");
    		//2.匿名自执行函数的第二种实现方式
    		(function(){
    			// alert("fff");
    		}());
    		//3.匿名自执行函数的第三种实现方式
    		!function(data){
    			// alert(data);
    		}("hhh");
    		//4.匿名自执行函数的第四种实现方式
    		var fun=function(data){
    			alert(data);
    		}("iii");

从上面的代码块中我们可以总结出实现匿名自执行函数的方法一般有四种。