JavaScript 函数和函数表达式

    在本教程中，您将借助示例了解 JavaScript 函数和函数表达式。

JavaScript 函数

    函数是执行特定任务的代码块。
    假设您需要创建一个程序来创建一个圆圈并为其着色。您可以创建两个函数来解决此问题：

• 一个画圆的函数
• 给圆上色的函数

    将一个复杂的问题分成更小的块使您的程序易于理解和可重用。
    JavaScript 还有大量的内置函数。例如，Math.sqrt() 是一个计算数字平方根的函数。
    在本教程中，您将了解用户定义的函数。

声明一个函数

    声明函数的语法是：

function nameOfFunction () {
    // function body   
}

• 使用 function 关键字声明函数。
• 命名函数的基本规则类似于命名变量。最好为函数起一个描述性名称。例如，如果一个函数用于两数相加，则可以将该函数命名为 add 或 addNumbers。
• 函数体写在 { } 中。

    例如，

// declaring a function named greet()
function greet() {
    console.log("Hello there");
}

调用函数

    在上面的程序中，我们声明了一个名为 greet() 的函数，要使用该函数，我们需要调用它。
    这是调用上述 greet() 函数的方法。

// function call
greet();

JavaScript 中函数的工作原理

示例 1：显示文本

// program to print a text
// declaring a function
function greet() {
    console.log("Hello there!");
}

// calling the function
greet();

    输出

Hello there!

函数形参

    函数也可以用形参声明。形参是在声明函数时传递的值。

JavaScript 中带形参的函数工作原理

示例 2：带形参的函数

// program to print the text
// declaring a function
function greet(name) {
    console.log("Hello " + name + ":)");
}

// variable name can be different
let name = prompt("Enter a name: ");

// calling function
greet(name);

    输出

Enter a name: Simon
Hello Simon :)

    在上面的程序中，greet 函数是用 name 形参声明的。系统会提示用户输入名称。然后，当调用函数时，一个实参被传递到函数中。
    注意：当声明函数时，传递的值被称为形参（parameter）。调用函数时，传递的值被称为实参（argument）。

示例 3：两数相加

// program to add two numbers using a function
// declaring a function
function add(a, b) {
    console.log(a + b);
}

// calling functions
add(3,4);
add(2,9);

    输出

7
11

    在上述程序中，add 函数用于求两数之和。

• 函数由两个形参 a 和 b 声明。
• 使用函数名调用函数，并在一个函数中传递两个实参 3 和 4，在另一个函数中传递两个实参 2 和 9。

    请注意，您可以根据需要多次调用函数。您可以编写一个函数，然后使用不同的实参多次调用它。

函数返回值

    return 语句可用于将值返回给函数调用。
    return 语句表示函数已结束。return 后的任何代码都不会执行。
    如果没有返回任何内容，则函数返回一个 undefined 值。

JavaScript 中带 return 语句的函数的工作原理

示例 4：两数之和

// program to add two numbers
// declaring a function
function add(a, b) {
    return a + b;
}

// take input from the user
let number1 = parseFloat(prompt("Enter first number: "));
let number2 = parseFloat(prompt("Enter second number: "));

// calling function
let result = add(number1,number2);

// display the result
console.log("The sum is " + result);

    输出

Enter first number: 3.4
Enter second number: 4
The sum is 7.4

    在上述程序中，函数使用 return 语句返回数字之和。该值存储在 result 变量中。

使用函数的好处

• 函数使代码可重用。您可以一次声明，多次使用。
• 函数使程序更容易，因为每个小任务都被分成一个函数。
• 函数增加了可读性。

函数表达式

    在 Javascript 中，函数也可以定义为表达式。例如，

// program to find the square of a number
// function is declared inside the variable
let x = function (num) { return num * num };
console.log(x(4));

// can be used as variable value for other variables
let y = x(3);
console.log(y);

    输出

16
9

    在上述程序中，变量 x 用于存储函数。在这里，函数被视为一个表达式。使用变量名调用函数。
    上面的函数称为匿名函数。
    注意：在 ES2015 中，JavaScript 表达式被写成箭头函数。您将在以后的教程中了解它们。

上一教程 ：JS Switch                                         下一教程 ：JS Variable Scope

参考文档

[1] Parewa Labs Pvt. Ltd. (2022, January 1). Getting Started With JavaScript, from Parewa Labs Pvt. Ltd: https://www.programiz.com/javascript/function