微信扫一扫打赏支持

范仁义js课程---53、匿名函数应用

范仁义js课程---53、匿名函数应用

一、总结

一句话总结：

匿名函数的应用有很多，比如1、创建函数表达式，2、创建json对象的方法，3、做回调函数，4、执行事件（比如onclick事件），5、作为函数的返回值，6、闭包，7、模仿块级作用域

 

1、如何用匿名函数模仿块级作用域？

用立即执行的匿名函数就可以模仿块级作用域，函数体部分的区域就相当于块级作用域，本质上还是应用的js的函数作用域的原理
(function(){
    //这里是我们的块级作用域（私有作用域）
})();

 

 

 

 

二、匿名函数应用

博客对应课程的视频位置：53、匿名函数应用
https://www.fanrenyi.com/video/19/154

 

  1 <!DOCTYPE html>
  2 <html lang="en">
  3 <head>
  4     <meta charset="UTF-8">
  5     <title>匿名函数应用</title>
  6 </head>
  7 <body>
  8 <!--
  9 
 10 -->
 11 <script>
 12     /*1、函数表达式*/
 13     // //将匿名函数赋值给变量fn。
 14     // var fn=function(){
 15     //     return "我是一只小小小小鸟，怎么飞也飞不高！"
 16     // };
 17     // //调用方式与调用普通函数一样
 18     // console.log(fn);
 19     // console.log(fn());//我是一只小小小小鸟，怎么飞也飞不高！
 20     //
 21     // /*2、对象*/
 22     // var obj={
 23     //     name:"孙悟空",
 24     //     age:18,
 25     //     fn:function(){
 26     //         return "我叫"+this.name+"今年"+this.age+"岁了！";
 27     //     }
 28     // };
 29     // console.log(obj.fn());//我叫孙悟空今年18岁了！
 30 
 31     /*3、回调函数*/
 32     // //定时器
 33     // setInterval(function(){
 34     //     console.log("我其实是一个回调函数，每次1秒钟会被执行一次");
 35     // },1000);
 36 
 37 </script>
 38 
 39 <!--4、事件-->
 40 <!--<input type="button" value="点我啊！" id="sub">-->
 41 <!--<script>-->
 42 <!--    //获得按钮元素-->
 43 <!--    var sub=document.querySelector("#sub");-->
 44 <!--    //给按钮增加点击事件。-->
 45 <!--    sub.onclick=function(){-->
 46 <!--        alert("当点击按钮时会执行到我哦！");-->
 47 <!--    }-->
 48 <!--</script>-->
 49 
 50 <script>
 51     /*5、返回值*/
 52     //闭包
 53     //将匿名函数作为返回值
 54     // function fn(){
 55     //     var aaaa=123;
 56     //     //返回匿名函数
 57     //     return function(){
 58     //         console.log(aaaa);
 59     //         return "孙悟空";
 60     //     };
 61     // }
 62     // console.log(fn()());
 63     // //调用匿名函数
 64     // console.log(fn()());//孙悟空
 65     // //或
 66     // var box=fn();
 67     // console.log(box());//孙悟空
 68 
 69     // //手写new测试
 70     // function newTest (constructFunction){
 71     //     let obj = {};
 72     //     obj.__proto__ = constructFunction.prototype;
 73     //     return function(){
 74     //         constructFunction.apply(obj,arguments);
 75     //         return obj;
 76     //     }
 77     // }
 78 
 79 </script>
 80 
 81 <script>
 82     /*6、模仿块级作用域*/
 83     //块级作用域，有的地方称为私有作用域。JavaScript中是没有块级作用域的
 84 
 85     // if(1==1){//条件成立，执行if代码块语句。
 86     //     var a=12;//a为全局变量
 87     // }
 88     // console.log(a);//12
 89     //
 90     // for(var i=0;i<3;i++){
 91     //     console.log(i);
 92     // }
 93     // console.log(i);//3
 94 
 95 
 96     //理解执行的匿名函数来做块级作用域
 97     // (function(){
 98     //     //这里是我们的块级作用域（私有作用域）
 99     //     var fff=123;
100     // })();
101     //console.log(fff);
102 
103 
104     // function fn(){
105     //     (function(){
106     //         var la="啦啦啦！";
107     //     })();
108     //     console.log(la);//报错---la is not defined
109     // }
110     // fn();
111 </script>
112 
113 </body>
114 </html>

 

 
posted @ 2020-03-08 15:03  范仁义  阅读(203)  评论(0)  编辑  收藏  举报