JavaScript 函数和函数表达式

函数是执行特定任务的独立代码块，而函数表达式是将函数存储在变量中的一种方式。

// create a function named greet()
function greet() {
    console.log("Hello World!");
}

// store a function in the displayPI variable
// this is a function expression
let displayPI = function() {
    console.log("PI = 3.14");
}

// call the greet() function
greet();

// call the reply() function
displayPI();

// Output:
// Hello World!
// PI = 3.14

创建 JavaScript 函数

我们可以使用 function 关键字在 JavaScript 中创建函数。

function greet() {
    console.log("Hello World!");
}

在这里，我们创建了一个名为 greet() 的简单函数，该函数在屏幕上打印 Hello World!。

我们的函数包含以下部分：

• Function 关键字 - function 关键字用于创建函数。
• 函数名 - 函数的名称是 greet，后跟括号 ()。
• 函数体 - 调用函数时执行的代码。在我们的例子中，它是 console.log("Hello World!");。

调用函数

之前，我们声明了一个名为 greet() 的函数。

function greet() {
   console.log("Hello World!");
}

如果运行上面的代码，我们不会得到任何输出。但为什么呢？

这是因为创建函数并不意味着我们正在执行其内部的代码。换句话说，函数已准备好并可供我们随时执行。

如果我们想使用该函数，我们需要调用它。

函数调用

greet();

如您所见，我们通过编写函数名（greet）后跟括号 () 来调用函数。

示例 1：JavaScript 函数调用

// create a function
function greet() {
    console.log("Hello World!");
}

// call the function
greet();

console.log("Outside function");

输出

Hello World!
Outside function

在上面的示例中，我们创建了一个名为 greet() 的函数。程序控制流程如下：

这里，

1. 当调用 greet() 函数时，程序控制会转移到函数定义。
2. 函数内的所有代码都将被执行（打印 Hello World!）。
3. 然后，程序控制会跳转到函数调用之后的下一条语句（打印 Outside function）。

JavaScript 函数参数

参数是您在调用函数时传递给函数的值。

// function with a parameter called 'name'
function greet(name) {
    console.log(`Hello ${name}`);
}

// pass argument to the function
greet("John");

// Output: Hello John

在上面的示例中，我们将 "John" 作为参数传递给了 greet() 函数。

注意括号内声明的 name 变量。

function greet(name) {
    // code
}

在这里，name 是一个 **函数参数**，它充当存储函数参数的占位符。

换句话说，参数 "John" 存储在 name 参数中。

请记住： 函数参数是我们传递给函数的 **值**，而函数参数是存储传递给函数的参数的 **占位符**。

将不同的参数传递给函数

我们可以在每次调用时传递不同的参数，使函数可重用且动态。

function greet(name) {
    console.log(`Hello ${name}`);
}

// pass "John" as argument
greet("John");

// pass "David" as argument
greet("David");

输出

Hello John
Hello David

示例 2：JavaScript 函数相加

我们也可以将多个参数传递给单个函数。例如：

// function with two arguments
function addNumbers(num1, num2) {
    let sum = num1 + num2;
   console.log(`Sum: ${sum}`);
}

// call function by passing two arguments
addNumbers(5, 4);

// Output:
// Sum: 9

在上面的示例中，我们创建了一个名为 addNumbers() 的函数，它有两个参数：num1 和 num2。这里：

• num1 接收第一个参数的值 **5**。
• num2 接收第二个参数的值 **4**。

然后，该函数将 num1 和 num2 的值相加，并将结果作为输出打印出来。

return 语句

我们可以使用 return 语句从 JavaScript 函数返回值。

// function to find square of a number
function findSquare(num) {

    // return square
    return num * num; 
}

// call the function and store the result
let square = findSquare(3);

console.log(`Square: ${square}`);

输出

Square: 9

在上面的示例中，我们创建了一个名为 findSquare() 的函数。该函数接受一个数字并返回该数字的平方。

在我们的例子中，我们传递了 **3** 作为函数的参数。因此，该函数返回 **3** 的平方，即 **9**，到函数调用处。

然后我们将此返回值存储在 square 变量中并打印出来。

return 语句会终止函数

return 语句之后的任何代码都不会执行。例如：

function display() {

    console.log("This will be executed.");

    return "Returning from function.";

    console.log("This will not be executed.");
}

let message = display();
console.log(message);  

输出

This will be executed.
Returning from function.

在此示例中，display() 函数不会执行其中的第二个 console.log() 语句。

这是因为函数执行在 return 语句处停止。因此，以下代码永远不会被执行：

console.log("This will not be executed.");

实际情况是这样的：

1. 首先，函数在屏幕上打印 This will be executed.。
2. 然后，它将字符串 Returning from function. 返回到函数调用。
3. 最后，函数终止其执行。
4. 然后将返回值存储在 message 变量中并打印出来。

JavaScript 库函数

JavaScript 提供了一些内置函数，可以直接在我们的程序中使用。我们不需要创建这些函数，只需要调用它们。

一些常见的 JavaScript 库函数是：

要了解有关库函数的更多信息，请访问 JavaScript 库函数。

示例 3：JavaScript 库函数

// Math.sqrt() computes the square root
let squareRoot = Math.sqrt(4);
console.log("Square Root of 4 is", squareRoot);

// Math.pow() computes the power
let power = Math.pow(2, 3);
console.log("2 to the power of 3 is", power);

// toUpperCase() converts text to uppercase
let band = "Iron Maiden";
let bandUpper = band.toUpperCase();
console.log(`Favorite Band: ${bandUpper}`);

输出

Square Root of 4 is 2
2 to the power 3 is 8
Favorite Band: IRON MAIDEN

这里，

• Math.sqrt(4) 计算 **4** 的平方根，结果为 **2**。
• Math.pow(2, 3) 计算 2 ^ 3（**2** 的 **3** 次方），结果为 **8**。
• band.toUpperCase() 将 band 变量中的字符串转换为大写，结果为 IRON MAIDEN。

函数表达式

在 JavaScript 中，函数表达式是将函数存储在变量中的一种方式。例如：

// store a function in the square variable
let square = function(num) {
    return num * num;
};

console.log(square(5));  

// Output: 25

在此示例中，计算数字平方的函数已分配给 square 变量。

然后，我们使用该变量通过代码 square(5) 调用函数表达式，其中 **5** 是函数参数。

注意： 与函数一样，我们需要在变量名后使用括号 () 来调用函数表达式。

另请阅读

• JavaScript 默认参数
• JavaScript 箭头函数
• JavaScript 回调函数