zoukankan      html  css  js  c++  java
  • JavaScript--函数、匿名函数和自执行函数详解

       函数的声明及调用

    1.函数的声明格式:   

        function 函数名([参数1],[参数2],.....){
              //函数体代码
              [return 返回值];
        }
    2.函数的调用:

    • js直接调用:函数名(参数1的值,参数2的值,......);
    • html事件调用:在HTML标签中,使用事件名="函数名()"
    <!DOCTYPE html>
    <html>
    
        <head>
            <meta charset="UTF-8">
            <title></title>
        </head>
    
        <body>
            <script type="text/javascript">
                function method() {
                    //JS直接调用
                    var num = add(1, 2);
                    console.log(num);
                }
    
                function add(num1, num2) {
                    //有返回值
                    return num1 + num2;
                }
            </script>
            <button id="btn" onclick="method()">函数</button>
        </body>
    
    </html>

    注意:使用函数表达式时,函数的调用语句和函数声明语句没有先后之分

       匿名函数的声明及调用

    使用匿名函数表达式。将匿名函数,赋值给一个变量

    • 声明:var func=function(){  }
    • 调用:func();
    <!DOCTYPE html>
    <html>
    
        <head>
            <meta charset="UTF-8">
            <title></title>
        </head>
    
        <body>
            <script type="text/javascript">
                function method(){
                    add(1, 2);  //可以执行
                }
                
                //add(3,4);  不能执行
                  
                var add=function(num1, num2) {
                    //有返回值
                    var num= num1 + num2;
                    console.log(num);
                }
            </script>
            <button id="btn" onclick="method()">匿名函数</button>
        </body>
    
    </html>

    注意:使用匿名函数表达式时,函数的调用语句,必须放在函数声明语句之后

       自执行函数的声明

    • 1.可以使用多种运算符开头但一般用! !function(形参列表){ }(实参列表)
    • 2.使用()将函数及函数后的括号包裹      (function(形参列表){ }(实参列表));
    • 3.使用()值包裹函数值                            (function(形参列表){ })(实参列表);
    <!DOCTYPE html>
    <html>
    
        <head>
            <meta charset="UTF-8">
            <title></title>
        </head>
    
        <body>
            <script type="text/javascript">
                //页面加载就会执行
                (function(a,b){
                    var c=a+b;
                    console.log(c);
                })(3,4);
            </script>
            <button id="btn" onclick="">自执行函数</button>
        </body>
    
    </html>
  • 相关阅读:
    一个C# usb与mcu通信的程序,附代码
    基于C#音乐播放器(附代码)
    基于C#俄罗斯方块
    FTP方式部署Azure Web App
    微信接口小例
    基于来信码的短信通知平台
    基于Windows服务的WCF
    基于IIS的WCF
    基于.NET的Excel开发:单元格区域的操作(读取、赋值、边框和格式)
    .NET通过RFC读取SAP数据
  • 原文地址:https://www.cnblogs.com/fengfuwanliu/p/10231582.html
Copyright © 2011-2022 走看看