函数是计算机程序的主要部分之一。它们是 JavaScript 的基本构建块之一并且被广泛使用。在本文中，我们将讨论函数的定义以及它们为何如此重要。我还将向您展示如何开始使用 JavaScript 编写函数。

让我们开始学习吧！

JavaScript 中的函数是什么？

函数是一个代码块，它封装了一个独立的、自包含的行为，供计算机执行。

函数是一组有组织的指令，它们对应于用户想要在他们的程序中实现的特定任务或特定功能，以实现单个所需的结果。

函数内的代码仅在需要时运行，即仅在调用时运行。

函数是编程中一个重要且有用的部分，因为它们创建了可重用的代码。

无需在程序的不同部分复制、粘贴和重复相同的代码，您可以使用函数仅在一处编写该代码。然后，您可以在需要时反复使用它。

当您想对程序进行更改或调试并尝试修复错误时，这也很有帮助。

无需寻找代码可能位于的不同部分，您只需查看一个使代码更具可读性的特定位置。

如何在 JavaScript 中声明函数

在 JavaScript 中创建函数的一般语法如下所示：

function name(parameter1,parameter2,...) {
    // the code statements to be executed
}

让我们分解一下：

• 你用function关键字声明一个函数。
• 接下来，您为该函数指定一个您选择的名称。JavaScript 中的函数名称区分大小写，约定和最佳实践是使用驼峰命名法。
• 函数名称后跟一组左括号和右括号。

函数可以通过输入来接收数据。这些输入括在括号中，称为参数。

参数用作值的局部占位符变量，这些值将在调用函数时作为输入传递到函数中。它们完全是可选的，如果有多个，则用逗号分隔它们。

• 最后是花括号，在它们内部是函数的主体以及在调用函数时要执行的代码语句。这是处理函数输入的地方。

如何在 JavaScript 中声明和调用一个简单的函数

function greeting() {
  console.log('Hello World!');
}

上面，我们创建了一个名为greeting的函数。

这个功能是一个非常基本的功能，它的功能非常单一。它不接受任何输入，唯一执行的事件就是将Hello World!打印到控制台。

定义一个函数本身并不会在函数体内运行代码。如果我们想要看到运行结果，必须调用该函数。这也称为函数调用。

要调用不接受输入的函数，只需编写函数名称，后跟括号和分号。

greeting();

//output
//Hello World!

现在，您只需多次调用该函数本身即可多次重用该函数。这有助于避免重复代码：

greeting();
greeting();
greeting();

//output
// Hello World!
// Hello World!
// Hello World!

如何在 JavaScript 中声明和调用带参数的函数

我们可以修改前面的示例以获取输入。如前所述，我们将使用参数执行此操作。

参数是您在声明函数时传递给函数的值。

function greeting(name) {
  console.log('Hello ' + name + ' !' );
}

命名的greeting函数现在接受一个参数name。在函数中将hello字符串使用+与name 和末尾的感叹号连接  。

调用接受参数的函数时，需要传入参数。

参数是您在调用函数时提供的值，它们对应于在函数的声明行中传递的参数。

例如：

greeting('Jenny');
//Output
// Hello Jenny !

参数是值Jenny，您可以将其视为name = 'Jenny'。name，参数，是占位符变量，Jenny是调用函数时传入的值。

函数可以接受多个参数，也可以将数据返回给程序的用户：

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

上面的代码创建了一个名为addNums的函数，它接受两个参数 num1和num2，用逗号分隔。

与函数输入的方式相同，它们也输出一个值

该函数将num1和 num2的和作为其输出返回。这意味着它处理这两个参数，执行请求的计算，并将最终值作为结果返回给用户。

调用函数时，必须传入两个参数，因为它接受两个参数：

addNums(10,20);
//Output
// 30
// think of it as num1 = 10 and num2 = 20

每次调用该函数时，您都可以传入不同的参数：

addNums(2,2);
// 4
addNums(3,15);
//18

JavaScript 函数中的变量范围

变量范围是指变量对程序不同部分的可见性。

在函数块外部和之前定义的变量具有全局作用域，可以从函数内部访问：

const num = 7;

function myFunc() {
  console.log(num);
}

//Access the variable with a global scope from anywhere in the program:
console.log(num);
//Output
//7

//Call the function with the variable with global scope
myFunc();
//Output
// 7

但是，如果该变量是在函数内部定义的，它将具有局部作用域，并且仅在定义它的函数中受到限制和可见。

您无法从函数外部访问它：

function myFunc() {
  const num = 7;
  console.log(num);
}

// Try to access the variable with local scope from outside the function scope:
console.log(num);
//Otput:
//Uncaught ReferenceError: num is not defined

//Call the function with the variable defined inside the function:
myFunc();
//Ouput
//7

函数表达式

您还可以使用表达式创建函数。

这些函数是在表达式中创建的，而不是像您目前看到的那样使用函数声明创建。

const name = function(firstName) {
  return 'Hello ' + firstName ;
  }

在这里，我们使用变量name来存储函数。

要调用该函数，您可以像这样使用变量名：

console.log(name('Jenny'));
//Output
//"Hello Jenny"

这种类型的函数也称为匿名函数，因为它们不需要名称。

下面列出了命名函数和匿名函数之间的区别：

//named
function name(firstName) {
    console.log('Hello ' + firstName);
 }
 
name('Jenny');
 
//anonymous
const name = function(firstName) {
  return 'Hello ' + firstName ;
  }
 console.log(name('Jenny')); 

匿名函数中的变量也可以用作其他变量的值：

const name = function(firstName) {
  return 'Hello ' + firstName ;
  }
  
const myName = name('Timmy');
console.log(myName);
//Ouput
//"Hello Timmy"