JavaScript 函数和函数表达式

x33g5p2x  于2022-04-15 转载在 Java  
字(2.6k)|赞(0)|评价(0)|浏览(493)

在本教程中,您将借助示例了解 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

相关文章

最新文章

更多