Web全栈工程师之路(三)——JavaScript篇(十四)——函数(二)

以下是html代码，个人建议放在IDE里运行，边看效果，边学习~

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>JS初步(十四)——函数(二)</title>
    <script>
        /*  
            函数的返回值
                - 可以使用return来设直函数的返回值
                - 语法：
                    return 返回值;
                - return后的值将会作为函数的执行结果返回，可以定义一个支量，来接收该结果
                - 函数返回什么result的值就是什么
                - return后可以跟任意类型的值
                
        */

        //创建一个函数，用来计算三个数的和
        function add(a,b,c){
            var d = a + b + c;
            return d; //利用return来返回d的值，至于返回给谁，则看你的意思
        }

        var e = add(1,2,3); //将函数的返回值赋值给变量e
        document.write(e+"<br/>"); //输出e看看

        //同样的return后面的返回值除了可以是变量，也可以是表达式
        //如果什么都不写即"return;"，则默认return返回undefined

        //创建一个函数，用来计算四个数的和

        function add2(a,b,c,d){
            var e = a + b + c;
            return e + d; //利用return来返回d的值，至于返回给谁，则看你的意思
            alert(d); //函数执行到return地方就停止了，后面的代码都不会执行，所以函数一般以return结尾
        }

        var a = add2(1,2,3,4);
        document.write(a+"<br/>");

        //如果函数没有return，而你还用一个变量来接收不存在的返回值，那么那个变量会得到undefined

        function none(){
            var a = "这里的函数没有返回值";
        }

        var b = none(); //把返回值为空的函数赋值给b
        document.write(b+"<br/>"); //输出undefined

        //练习：定义一个函数，判断一个数字是否是偶数，如果是返回true，否则返回false

        function isOu(num){
            //可以写成这样，感兴趣的可以解除注释试试
            /* 
                if(num % 2 ==0){
                    return true;
                }else{
                    return false;
                }
            */
            //也可以这样写
            return num % 2 == 0; //这是一个判断表达式
        }

        document.write(isOu(98)+"<br/>"); //输出true
        document.write(isOu(37)+"<br/>"); //输出false

        //练习：定义一个函数，可以根据半径计算一个圆的面积，并返回计算结果，计算公式：3.14*r*r

        function circle_Area(r){
            return 3.14*r*r;
        }

        document.write(circle_Area(10)+"<br/>"); //输出314

        //实参可以是任意的数据类型，也可以是一个对象
        //当我们的参数过多时，可以将参数封装到一个对象中，然后通过对象传递

        //练习：利用对象输出个人信息

        var personalData = { //创建个人信息对象
            name:"李耳",
            gender:"男",
            age:18,
            book:"道德经"
        };

        function personal_Data(o){
            document.write("大家好，我的名字叫"+o.name+"，性别"+o.gender+"，"+o.age+"岁，最喜欢看的书是我自己写的"+o.book+"<br/>");
        }

        personal_Data(personalData); //输出看看

        //实参可以是一个对象，也可以是一个函数

        /*  
            personal_Data
                - 函数对象
                - 相当于直接使用函数对象
            personal_Data()
                - 调用函数
                - 相当于使用的函数的返回值
        */
    </script>
</head>
<body>
    
</body>
</html>

 

posted @ 2020-05-31 18:51  骨桜  阅读(176)  评论(0)    收藏  举报