JavaScript函数参数与实参详解：从传递值到默认参数在前端开发中的应用

1. 引言

对于前端开发者来说，JavaScript是一种不可或缺的编程语言。它以其强大的功能和简洁的语法而闻名。本文将主要讨论JavaScript中的函数参数和实参的关系。

2. 函数参数和实参的概念

函数参数是在函数声明中列出的变量名称，它们是函数的形式参数。实参是在函数调用时传递给函数的值。这两个词经常搭伴出现，比如我们平常聊天可能会说：“这个函数运行需要两个小帮手”，这里的小帮手其实就是指函数的形式参数。而当我们提到“我们把两个数字塞给函数当小帮手”时，这里的“小帮手”实际就是函数的实参啦。

3. 函数参数和实参的关系

函数参数和实参之间的关系非常简单。当你调用一个函数时，你需要向函数传递一些值。这些值被称为实参，它们会被分配给函数的形参。换句话说，实参就像是函数在干活儿时需要的原料，它是实实在在要喂给函数的东西；而形参呢，你可以把它理解成一个篮子或者箱子，它的任务就是用来装这些原料，等待函数来取用。
例如，考虑下面的函数：

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

在这个函数中，`num1`和`num2`是我们定义的两个形参。当我们调用这个函数时，我们需要向它传递两个值。这些值被称为实参。例如：

// 示例如下
var result = addNumbers(5, 10);

在这个例子中，`5`和`10`是我们传递给`addNumbers()`函数的两个实参。这两个实参分别被分配给了`num1`和`num2`形参。然后，函数返回了这两个形参的和。

4. 默认参数

默认参数是JavaScript中一种非常有用的特性。在我们声明函数并给参数排排坐的时候，完全可以给每个小参数都安排一个默认值，这样它们就不用担心没被“喂饱”啦。这样，如果我们在函数调用时不提供该参数的值，那么函数将使用默认值。
例如，让我们修改我们的`addNumbers()`函数，使其接受可选的第三个参数：

function addNumbers(num1, num2, thirdNum = 0) {
    return num1 + num2 + thirdNum;
}

在这个版本的函数中，`thirdNum`是一个形参，它有一个默认值`0`。如果咱们在调用`addNumbers()`这个函数的时候，忘记给`thirdNum`赋个值的话，那这个函数就相当机智地，默认把`thirdNum`当作是零来用。
例如：

var result = addNumbers(5, 10); // 返回15
var result2 = addNumbers(5, 10, 20); // 返回45

在这个例子中，我们首先调用了`addNumbers()`函数两次，但只提供了两个实参。因此，函数使用其形参的默认值。然后，我们再次调用了`addNumbers()`函数，这次提供了三个实参。所以，函数使用提供的值。

5. 总结

函数参数和实参是JavaScript中的重要概念。他们之间的关系其实特简单，就像这样：当你在呼唤一个函数的时候，得给它带上一些小礼物，这些小礼物我们就叫它们“实参”。实参被分配给函数的形参。在编写JavaScript代码时，理解函数参数和实参的关系是非常重要的。要是你能正确地理解和运用这两个小概念，那你就能够编写出更加灵活、更加强劲的函数啦，就像给你的编程技能插上翅膀一样。