JavaScript函数的定义和使用（非常详细）

自定义函数是开发者根据实际功能需求定义的函数，通常将某段实现特定功能的代码定义成一个函数，写在一个独立的代码块中，在需要使用的时候调用即可。

JavaScript函数的定义

JavaScript 使用关键字 function 来定义函数，包括有名函数和匿名函数。

有名函数语法格式如下：

function 函数名（[参数1, 参数2, …, 参数n]）{
    函数体;
    [return 返回值;]
}

匿名函数语法格式如下：

var fn = function ([参数1, 参数2, …, 参数n]) {
    函数体;
    [return 返回值;]
}

语法格式说明如下：

function：函数定义时必须使用的关键字。函数是对象类型，但 typeof 的结果是“function”，而不是“object”。
函数名：定义的函数名称，像变量名一样，必须符合标识符的命名规则，遵循命名规范，通常是动名词，例如 getElementById。
参数1，参数2，…，参数n：形参列表，默认值是 undefined。根据实际情况，可以有形参，也可以没有形参。当有多个参数时，中间以“,”隔开，函数调用时需要给形参传递值。
函数体：函数定义的主体，是函数功能的实现代码。
返回值：使用 return 关键字将需要返回的数据传递给调用者。如果没有返回值，则省略 return 语句，此时函数返回 undefined。
fn是一个变量名，变量值是一个函数。

有名函数和匿名函数的区别：有名函数可以预解析，因此有名函数可以在定义之前使用，而匿名函数必须在定义后才可以使用。

函数定义的示例如下：
1) 定义带 return 语句的有名函数：

function getSum(num1, num2) {
    return num1 + num2;
}

上述代码定义了名为 getSum 的函数，其中有两个形参 num1 和 num2，函数返回传入的两个参数值的和。

2) 定义不带 return 语句的有名函数：

function sayHi(name) {
    console.log('hi~~' + name);
}

上述代码定义了名为 sayHi 的函数，其中有一个形参 name，函数向控制台输出结果。

3) 定义匿名函数：

var getSum = function (num1, num2) {
    return num1 + num2;
}

上述代码将一个匿名函数赋值给变量 getSum，其余语法和有名函数一样。

函数定义后，其内部的代码并不会自动执行。函数的执行需要通过调用函数来实现。

调用有名函数的语法格式如下：

函数名([参数1,参数2,…])

调用匿名函数的语法格式如下：

变量名([参数1,参数2,…])

其中，“参数1，参数2，…”表示实参列表，是可选的，小括号必不可少。

【实例】调用有名函数。

function getSum(num1, num2) {
    return num1 + num2;
}
alert(getSum(1, 2));

程序定义了有名函数 getSum()，它有两个参数，函数的功能是返回两个参数值的和。调用函数 getSum()，将数值 1 和 2 分别传递给参数 num1 和 num2。在Chrome浏览器控制台中的运行结果为：

3

程序中将调用函数的语句 alert(getSum(1,2)) 写在函数定义前也是可以的。有名函数可以预解析，因此有名函数可以在定义之前使用。

【实例】调用匿名函数。

var getSum = function (num1, num2) {
    return num1 + num2;
}
alert(getSum(1, 2));

程序中将匿名函数赋值给了变量 getSum，它在 Chrome 浏览器控制台中运行结果为：

3

匿名函数必须在定义后才可以使用。将调用函数的语句 alert(getSum(1,2)) 写在函数定义之前，程序会发生错误。

在开发中，如果希望某个功能只能实现一次，可以使用匿名函数的自调用方式来完成。匿名函数自调用形式：(function () {})()。

调用函数传入的实参和形参的个数要保持一致，不匹配的情况说明如下表所示。

表：实参和形参不匹配的情况说明
参数个数	说明
实参个数多于形参个数	只取到形参的个数
实参个数小于形参个数	多的形参的值是 undefined