web前端入门到实战:javscript函数的运用

作者: 560b7bb7b879 | 来源:发表于2019-09-24 22:06 被阅读0次

    函数,一段能够自动完成某些功能的代码块,函数的出现,既解决了重复使用重一功能的需求,又可以避免代码的臃肿性。使用函数有两个要求:必须调用后才可以执行;函数名不要和关键字以及系统函数相同;

    函数主要有三种,直接调用,参数传递,返回值。

    1、直接调用:

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>圆的面积</title>
    </head>
    <body>
        <script type="text/javascript">
        //求任意一个圆的半径,得到面积
        function mianji(){
    
            var r=prompt("请输入圆的半径:");
    
            s=3.14*r*r;
    
            alert("圆的面积是"+s);
    
        }
    
         mianji();
    
        </script>
    
    </body>
    </html>
    

    2、参数传递:

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>圆的面积</title>
    </head>
    <body>
         <script type="text/javascript">
        //求任意一个圆的半径,得到面积
              function miaji(r){
    
               s=3.14*r*r;
    
             alert("圆的面积为:"+s);
    
             }
    
            miaji(2);
    
          miaji(3);
        </script>
    </body>
    </html>
    

    3、返回值(在一般的前端开发中,使用的都返回值):

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>函数返回值</title>  
    </head>
       <body>
        <script type="text/javascript">
             //返回值
             function getSum(n,m){
    
                var sum=0;
    
                for(var i=n;i<=m;i++){
    
                  sum+=i;
    
                }
    
                //返回计算的值
                return sum;
    
             }
    
            console.log(getSum(1,100));
    
            //控制台查询结果
            </script>
       </body>
    </html>
    

    自己是一个6年的前端工程师,希望本文对你有帮助!

    这里推荐一下我的前端学习交流扣qun:731771211 ,里面都是学习前端的,如果你想制作酷炫的网页,想学习编程。自己整理了一份2019最全面前端学习资料,从最基础的HTML+CSS+JS【炫酷特效,游戏,插件封装,设计模式】到移动端HTML5的项目实战的学习资料都有整理,送给每一位前端小伙伴,每天分享技术

    点击:加入

    相关文章

      网友评论

        本文标题:web前端入门到实战:javscript函数的运用

        本文链接:https://www.haomeiwen.com/subject/gymmdctx.html