Cocos2d-x学习笔记:完全掌握JS API与游戏项目开发 (未来书库,触控未来官方教材)
上QQ阅读APP看书,第一时间看更新

2.9 函数

我们将程序中反复执行的代码封装到一个代码块中,这个代码块模仿了数学中的函数,具有函数名、参数和返回值。

JavaScript中的函数很灵活,它可以独立存在,作全局函数;也可以在别的函数中,作函数嵌套;也可以在对象中定义。

2.9.1 使用函数

使用函数首先需要定义函数,然后在合适的地方调用该函数,函数的语法格式如下:

    function 函数名(参数列表) {
        语句组
        [return 返回值]
    }

在JavaScript中定义函数时关键字是function,“函数名”需要符合标识符命名规范;“参数列表”可以有多个并用逗号(,)分隔,极端情况下可以没有参数。

如果函数有值,需要使用return语句将值返回;如果没有返回值,则函数体中可以省略return语句。

函数定义示例代码如下:

    function rectangleArea(width, height) {                                        ①
        var area = width * height;
        return area;                                                             ②
    }
    console.log("320×480的长方形的面积:" + rectangleArea(32, 64));                         ③

上述代码第①行是定义计算长方形面积的函数rectangleArea,它有两个参数,分别是长方形的宽和高。第②行代码是返回函数计算结果。调用函数的过程是通过代码第③行中的rectangleArea(32,64)语句实现,调用函数时需要指定函数名和参数值。

2.9.2 变量作用域

变量可以定义在函数体外,即全局变量;可以在函数内定义,即局部变量,局部变量作用域是在函数内部有效,如果超出函数体就会失效。

我们看看下面示例代码:

    var global = 1;                                                                ①
    function f() {
        var local = 2;                                                            ②
        global++;                                                                ③
        return global;
    }
    
    f();
    
    console.log(global);                                                        ④
    console.log(local);                                                      ⑤

上述代码第①行是定义全局变量global,第②行代码是定义局部变量local,local是在函数体内部定义的。第④行代码是打印全局变量global,第⑤行代码是打印局部变量local,该语句在运行时会发生错误,因为local是局部变量,作用域是在f函数体内部。

2.9.3 嵌套函数

在此之前定义的函数都是全局函数,它们定义在全局作用域中,也可以把函数定义在另外的函数体中,称作嵌套函数。

下面看一个示例:

    function calculate(opr, a, b) {                                                ①
    
        //定义+函数
        function add(a, b) {                                                    ②
            return a + b;
        }
    
        //定义-函数
        function sub(a, b) {                                                    ③
            return a - b;
        }
    
        var result;
    
        switch (opr) {
            case "+" :
                result = add(a, b);                                             ④
                break;
            case "-" :
                result = sub(a, b);                                             ⑤
        }
        return result;                                                         ⑥
    }
    
    var res1 = calculate("+", 10, 5);                                             ⑦
    console.log("10 + 5 = " + res1);
    
    var res2 = calculate("-", 10, 5);                                             ⑧
    console.log("10 - 5 = " + res2);

上述代码第①行定义calculate函数,它的作用是根据运算符进行数学计算,它的参数opr是运算符,参数a和b是要计算的数值。在calculate函数体内,第②行定义嵌套函数add,对两个参数进行加法运算。第③行定义嵌套函数sub,对两个参数进行减法运算。第④行代码是在运算符为“+”号情况下使用add函数进行计算,并将结果赋值给result。第⑤行代码是在运算符为“-”号情况下使用sub函数进行计算,并将结果赋值给result。第⑥行代码是返回函数变量result。

第⑦行代码调用calculate函数进行加法运算。第⑧行代码调用calculate函数进行减法运算。

程序运行结果:

    10 + 5 = 15
    10 - 5 = 5

在函数嵌套中,默认情况下嵌套函数的作用域是在外函数体内。

2.9.4 返回函数

我们可以把函数作为另一个函数的返回类型使用。下面看一个示例:

    //定义计算长方形面积函数
    function rectangleArea(width, height) {
        var area = width * height;
        return area;
    }
    
    //定义计算三角形面积函数
    function triangleArea(bottom, height) {
        var area = 0.5 * bottom * height;
        return area;
    }
    
    function getArea(type) {                                                    ①
        var returnFunction;                                                     ②
        switch (type) {
            case "rect":   //rect 表示长方形
                returnFunction = rectangleArea;                                 ③
                break;
            case "tria":  //tria 表示三角形
                returnFunction = triangleArea;                                 ④
        }
        return returnFunction;                                                 ⑤
    }
    
    //获得计算三角形面积函数
    var area = getArea("tria");                                                ⑥
    console.log("底10 高13,三角形面积: " + area(10, 15));                    ⑦
    
    //获得计算长方形面积函数
    var area = getArea("rect");                                                ⑧
    console.log("宽10 高15,计算长方形面积: " + area(10, 15));               ⑨

上述代码第①行定义函数getArea(type),第②行代码是声明returnFunction变量保存要返回的函数名。第③行代码是在类型type为rect(即长方形)情况下,把前面定义的rectangleArea函数名赋值给returnFunction变量。第④代码是在类型type为tria(即三角形)情况下,把前面定义的triangleArea函数名赋值给returnFunction变量。第⑤代码是将returnFunction变量返回。

第⑥行和⑧行代码是调用函数getArea,返回值area是函数类型。第⑦行和⑨行代码中的area(10,15)是调用函数。

上述代码运行结果如下:

    底10高13,三角形面积: 75.0
    宽10高15,计算长方形面积: 150.0

此外,还可以采用匿名函数作为返回值。修改上面的示例代码如下:

    function getArea(type) {
        var returnFunction;
        switch (type) {
            case "rect":   //rect 表示长方形
                returnFunction = function rectangleArea(width, height) {                    ①
                    var area = width * height;
                    return area;
                };
                break;
            case "tria":  //tria 表示三角形
                returnFunction = function triangleArea(bottom, height) {                    ②
                    var area = 0.5 * bottom * height;
                    return area;
                };
        }
        return returnFunction;
    }
    
    //获得计算三角形面积函数
    var area = getArea("tria");
    console.log("底10 高13,三角形面积: " + area(10, 15));
    
    //获得计算长方形面积函数
    var area = getArea("rect");
    console.log("宽10 高15,计算长方形面积: " + area(10, 15));

我们采用匿名函数赋值给returnFunction变量,第①行和第②行代码采用匿名函数表达式。