【JavaScript-Day 16】函数探秘：代码复用的基石——声明、表达式与调用详解-CSDN博客

本文链接：https://blog.csdn.net/Kiradzy/article/details/148048366

Langchain系列文章目录

01-玩转LangChain：从模型调用到Prompt模板与输出解析的完整指南
 02-玩转 LangChain Memory 模块：四种记忆类型详解及应用场景全覆盖
 03-全面掌握 LangChain：从核心链条构建到动态任务分配的实战指南
 04-玩转 LangChain：从文档加载到高效问答系统构建的全程实战
 05-玩转 LangChain：深度评估问答系统的三种高效方法（示例生成、手动评估与LLM辅助评估）
06-从 0 到 1 掌握 LangChain Agents：自定义工具 + LLM 打造智能工作流！
07-【深度解析】从GPT-1到GPT-4：ChatGPT背后的核心原理全揭秘
 08-【万字长文】MCP深度解析：打通AI与世界的“USB-C”，模型上下文协议原理、实践与未来

Python系列文章目录

PyTorch系列文章目录

机器学习系列文章目录

深度学习系列文章目录

Java系列文章目录

JavaScript系列文章目录

文章目录

Langchain系列文章目录
Python系列文章目录
PyTorch系列文章目录
机器学习系列文章目录
深度学习系列文章目录
Java系列文章目录
JavaScript系列文章目录
前言
一、初识函数：代码的魔术师
- 1.1 什么是函数？
- - 1.1.1 函数的核心价值：封装与复用
  - 1.1.2 函数的构成要素 (概览)
二、创建你的第一个函数：函数的声明方式
三、激活函数：函数的调用
- 3.1 如何调用函数？
- - 3.1.1 基本调用语法
  - 3.1.2 调用时的注意事项
四、函数的“桥梁”：参数与实际参数
五、实际应用场景与常见问题
六、总结

前言

在编程的世界里，我们经常需要重复执行某些相似的操作。如果每次都重新编写相同的代码，不仅效率低下，而且难以维护。JavaScript 中的函数（Function）正是为了解决这一问题而生的。它们是组织和复用代码的基本构建块，能够将一系列相关的操作封装起来，形成一个独立的功能单元。理解并熟练运用函数，是每一位 JavaScript 学习者从入门到进阶的必经之路。

本篇文章将带你深入探索 JavaScript 函数的核心概念，包括：

什么是函数及其核心价值？
如何通过函数声明和函数表达式创建函数？
如何正确调用函数并传递信息？
形参（Parameters）和实参（Arguments）之间的区别与联系。

无论你是编程新手，还是希望巩固基础知识的进阶者，本文都将为你提供清晰、系统且实用的指导。

一、初识函数：代码的魔术师

在我们深入了解函数的具体语法之前，首先需要明白函数究竟是什么，以及它为什么如此重要。

1.1 什么是函数？

简单来说，函数是一段预先定义好的、可以被重复调用、用以执行特定任务的代码块。你可以把它想象成一个小型“程序”或者一个“指令集”，当你需要它执行任务时，只需“喊出它的名字”（即调用函数），它就会按照预设的步骤开始工作。

1.1.1 函数的核心价值：封装与复用

函数的核心价值主要体现在以下两个方面：

封装 (Encapsulation)：函数可以将一系列相关的代码语句组织和包装起来，形成一个独立的功能模块。这样做的好处是隐藏了内部的实现细节，调用者只需关心函数的输入（参数）和输出（返回值），而无需了解函数内部是如何工作的。这使得代码更加模块化，易于理解和管理。
- 类比：就像使用电视遥控器，你按下“音量+”按钮（调用函数），电视音量就会增加（执行任务）。你不需要知道遥控器内部的电路是如何工作的，只需要知道这个按钮的功能即可。
复用 (Reusability)：一旦函数被定义，它就可以在程序的不同位置被多次调用，而无需重复编写相同的代码。这极大地提高了代码的编写效率，减少了代码冗余，同时也使得代码修改和维护更加方便。如果需要修改某个功能，只需修改对应的函数定义即可，所有调用该函数的地方都会生效。
- 类比：一个制作蛋糕的食谱（函数定义）可以被用来制作很多个蛋糕（多次调用），而不需要每次都重新发明制作蛋糕的流程。

1.1.2 函数的构成要素 (概览)

一个典型的 JavaScript 函数主要由以下几个部分构成：

function 关键字：用于声明或定义一个函数。
函数名 (Function Name)：函数的唯一标识符，用于后续调用。函数名是可选的（例如匿名函数）。
参数列表 (Parameter List)：位于括号 () 内，用于接收外部传入函数的数据。参数之间用逗号分隔。参数也是可选的。
函数体 (Function Body)：位于花括号 {} 内，包含实现函数功能的具体代码语句。
return 语句 (可选)：用于指定函数的返回值。如果函数没有 return 语句，或者 return 后面没有表达式，则函数默认返回 undefined。

下面是一个简单的函数结构示意图：

graph LR
    A[function 关键字] --> B(函数名);
    B --> C["(参数列表)"];
    C --> D["{"];
    D --> E[函数体: JavaScript 语句];
    E --> F[return 返回值 (可选)];
    F --> G["}"];

二、创建你的第一个函数：函数的声明方式

在 JavaScript 中，主要有两种创建（或声明）函数的方式：函数声明 (Function Declaration) 和函数表达式 (Function Expression)。

2.1 函数声明 (Function Declaration)

函数声明是最常见也是最直接的定义函数的方式。

2.1.1 语法结构

函数声明使用 function 关键字，后跟函数名、参数列表和函数体。

// 函数声明语法
function functionName(parameter1, parameter2, /* ..., */ parameterN) {
  // 函数体：执行特定任务的代码
  // 例如：
  // console.log("函数被调用了！");
  // return result; // 可选的返回值
}

示例：创建一个问候用户的函数

// 函数声明：greetUser
function greetUser(name) {
  // name 是一个参数，代表用户的名字
  let greeting = "你好，" + name + "！欢迎学习 JavaScript 函数。";
  console.log(greeting); // 在控制台输出问候语
}

在这个例子中，greetUser 是函数名，name 是参数。当调用这个函数并传入一个名字时，它会在控制台打印出个性化的问候语。

2.1.2 函数声明的特点：函数提升 (Hoisting)

函数声明一个非常重要的特性是函数提升 (Hoisting)。这意味着 JavaScript 解释器在执行代码之前，会先读取所有的函数声明，并将它们“提升”到当前作用域的顶部。因此，你可以在函数声明之前调用该函数，代码依然能够正常工作。

示例：函数提升演示

// 在函数声明之前调用
sayHello(); // 输出: "Hello from a hoisted function declaration!"

// 函数声明
function sayHello() {
  console.log("Hello from a hoisted function declaration!");
}

// 再次调用，依然正常
sayHello(); // 输出: "Hello from a hoisted function declaration!"

原理简析：虽然看起来函数调用在定义之前，但 JavaScript 引擎在代码执行的第一阶段（编译阶段）就已经处理了所有函数声明，使得它们在执行阶段是可用的。

2.2 函数表达式 (Function Expression)

函数表达式是另一种定义函数的方式，它将一个函数赋值给一个变量。这个函数可以是命名的，也可以是匿名的。

2.2.1 语法结构

函数表达式的典型形式是将一个匿名函数（没有函数名的函数）赋值给一个变量。

// 函数表达式语法 (匿名函数)
const variableName = function(parameter1, parameter2) {
  // 函数体
  // return result;
};

// 函数表达式语法 (命名函数 - 主要用于调试)
const anotherVariableName = function functionNameForDebugging(parameter1, parameter2) {
  // 函数体
  // return result;
};

使用 const 或 let 来声明存储函数的变量是现代 JavaScript 的推荐做法。

示例：使用函数表达式创建加法函数

// 函数表达式：addNumbers (匿名函数)
const addNumbers = function(num1, num2) {
  return num1 + num2; // 返回两个数字的和
};

// 函数表达式：multiplyNumbers (命名函数)
// "multiply" 这个名字主要在调试时，例如在调用栈中显示函数名时有用
const multiplyNumbers = function multiply(num1, num2) {
  return num1 * num2;
};

2.2.2 函数表达式的特点：变量提升规则

与函数声明不同，函数表达式的行为更像变量赋值。

如果使用 var 声明函数表达式的变量，变量声明会被提升，但赋值（即函数体本身）不会被提升。在赋值之前调用函数会导致 TypeError，因为此时变量的值是 undefined。
如果使用 let 或 const 声明，变量声明也会被提升，但它们存在“暂时性死区 (Temporal Dead Zone, TDZ)”。在声明语句之前访问这些变量会导致 ReferenceError。

示例：函数表达式的提升行为

// 尝试在函数表达式赋值前调用 (使用 const)
// console.log(subtractNumbers(10, 3)); // 会抛出 ReferenceError: Cannot access 'subtractNumbers' before initialization

const subtractNumbers = function(a, b) {
  return a - b;
};
console.log("10 - 3 =", subtractNumbers(10, 3)); // 输出: 10 - 3 = 7 (在此处调用则正常)

// 如果使用 var
// console.log(divideNumbers(10, 2)); // 会抛出 TypeError: divideNumbers is not a function
var divideNumbers = function(a, b) {
    if (b === 0) return "Cannot divide by zero";
    return a / b;
};
console.log("10 / 2 =", divideNumbers(10, 2)); // 输出: 10 / 2 = 5

因此，最佳实践是始终在函数表达式定义之后再调用它们。

2.2.3 函数声明与函数表达式的对比

为了更清晰地理解两者的区别，我们可以用一个表格来总结：

特性	函数声明 (Function Declaration)	函数表达式 (Function Expression)
基本语法	`function name() {}`	`const name = function() {};` 或 `let name = function() {};`
函数名	必须有	可以匿名，也可以命名 (主要用于调试)
提升行为	整个函数定义被提升 (可以在声明前调用)	变量声明被提升 (规则同 `var`, `let`, `const`)，函数体不提升
使用场景	通用函数定义	赋值给变量、作为参数传递 (回调函数)、IIFE (立即调用函数表达式)
分号	通常不需要在 `}` 后加分号 (因为它是一个声明)	通常需要在 `}` 后加分号 (因为它是一个赋值表达式的一部分)

选择哪种方式？

函数声明因其提升特性，使得代码组织更灵活，可以先调用后声明，有时更符合阅读习惯。
函数表达式则更加明确，何时函数可用是由变量赋值决定的。它们在创建回调函数、IIFE 或需要根据条件定义函数时非常有用。

在现代 JavaScript 开发中，两者都有其适用场景。理解它们的差异有助于写出更健壮和可维护的代码。

下面是一个简单的流程图，概括了选择和定义函数的过程：

graph TD
    A[开始: 需要定义一个功能块] --> B{选择函数定义方式};
    B --"倾向于传统、直接定义"--> C[函数声明];
    C --> D[语法: `function myFunc() {}`];
    D --> E{特性: 函数提升，可在声明前调用};
    B --"赋值给变量、用作回调等"--> F[函数表达式];
    F --> G[语法: `const myFunc = function() {};`];
    G --> H{特性: 遵从变量提升规则，函数体不提升};
    E --> I[函数定义完成];
    H --> I;
    I --> J[后续步骤: 调用函数];
    J --> K[结束];

三、激活函数：函数的调用

定义了函数之后，它并不会自动执行。你需要通过函数调用 (Function Invocation) 来“激活”它，让它运行其中定义的代码。

3.1 如何调用函数？

3.1.1 基本调用语法

调用一个函数非常简单，只需使用函数名，后跟一对圆括号 ()。如果函数定义了参数，你需要在括号内传入相应的实际参数（简称实参）。

functionName(argument1, argument2, /* ..., */ argumentN);

示例：调用之前定义的函数

// 1. 调用 greetUser 函数 (声明式)
greetUser("CSDN 优秀读者"); // 输出: 你好，CSDN 优秀读者！欢迎学习 JavaScript 函数。
greetUser("编程爱好者");    // 输出: 你好，编程爱好者！欢迎学习 JavaScript 函数。

// 2. 调用 addNumbers 函数 (表达式) 并获取返回值
const sumResult = addNumbers(15, 25); // 15 和 25 是实参
console.log("15 + 25 的结果是:", sumResult); // 输出: 15 + 25 的结果是: 40

// 3. 调用 multiplyNumbers 函数
const productResult = multiplyNumbers(7, 6);
console.log("7 * 6 的结果是:", productResult); // 输出: 7 * 6 的结果是: 42

在 addNumbers(15, 25) 中，addNumbers 是被调用的函数名，15 和 25 是传递给函数的实际参数 (Arguments)。函数执行后返回的值（在这里是 40）被赋给了 sumResult 变量。

3.1.2 调用时的注意事项

函数名大小写敏感：JavaScript 是大小写敏感的语言。greetuser 和 greetUser 会被认为是两个不同的函数。
```
// greetuser("Test"); // 如果 greetUser 是正确定义的，这里会报 ReferenceError: greetuser is not defined
```
调用未定义的函数：如果尝试调用一个尚未声明或定义的函数，JavaScript 会抛出 ReferenceError。
```
// nonExistentFunction(); // ReferenceError: nonExistentFunction is not defined
```

括号的重要性：调用函数时必须使用圆括号 ()。如果只写函数名而不加括号，你实际上是在引用函数对象本身，而不是调用它。

console.log(greetUser);
/*
输出的会是函数本身的定义，类似：
ƒ greetUser(name) {
  let greeting = "你好，" + name + "！欢迎学习 JavaScript 函数。";
  console.log(greeting);
}
*/

四、函数的“桥梁”：参数与实际参数

函数通常需要处理数据才能完成其任务。这些数据通过参数传递给函数。理解形式参数 (Parameters) 和 实际参数 (Arguments) 的概念至关重要。

4.1 理解形参 (Parameters)

4.1.1 形参的定义

形式参数（Parameters） 是在函数定义时，列在函数名后面圆括号 () 内的变量名。它们是函数内部的占位符，用于接收函数被调用时传入的实际值。

function calculateArea(width, height) { // 'width' 和 'height' 就是形参
  let area = width * height;
  return area;
}

在这个 calculateArea 函数中，width 和 height 就是形式参数。它们充当函数内部的局部变量，等待被赋予实际的值。

4.1.2 形参的作用域

形参只在函数体内部有效，它们是函数的局部变量。这意味着在函数外部无法直接访问它们。当函数执行完毕后，这些形参通常也会被销毁（除非形成了闭包，这是更高级的主题）。

4.2 理解实参 (Arguments)

4.2.1 实参的定义

实际参数（Arguments） 是在函数调用时，传递给函数的具体值。这些值会按顺序赋给函数定义中的形式参数。

let rectangleWidth = 10;
let rectangleHeight = 5;

// 调用 calculateArea 函数，并传入实参
let areaResult = calculateArea(rectangleWidth, rectangleHeight); // rectangleWidth (值为10) 和 rectangleHeight (值为5) 是实参
// 或者直接传入字面量值
// let areaResult = calculateArea(10, 5);

console.log("矩形的面积是:", areaResult); // 输出: 矩形的面积是: 50

在 calculateArea(rectangleWidth, rectangleHeight) 调用中，变量 rectangleWidth (其值为 10) 和 rectangleHeight (其值为 5) 是传递给 calculateArea 函数的实际参数。函数内部，形参 width 会接收到 10，形参 height 会接收到 5。

4.2.2 实参传递的规则

JavaScript 在处理函数参数传递时有一些灵活但需要注意的规则：

（1）参数数量匹配

实参数量多于形参数量：如果调用函数时传递的实参个数超过了函数定义的形参个数，多余的实参不会导致错误，但它们不能通过形参名直接访问。不过，可以通过特殊的 arguments 对象（稍后介绍）来访问所有传入的实参。

function logParams(param1, param2) {
  console.log("形参 param1:", param1);
  console.log("形参 param2:", param2);
  console.log("所有实参 (arguments object):", arguments);
}

logParams("A", "B", "C", "D");
// 输出:
// 形参 param1: A
// 形参 param2: B
// 所有实参 (arguments object): Arguments(4) ['A', 'B', 'C', 'D', callee: ƒ, Symbol(Symbol.iterator): ƒ]

实参数量少于形参数量：如果传递的实参个数少于形参个数，那么没有接收到对应实参的形参的值将是 undefined。
```
function greet(name, message) {
  console.log(name + ": " + message);
}

greet("Alice"); // 只传递了一个实参
// 输出: Alice: undefined
```
在 ES6 之后，可以为形参设置默认参数值来处理这种情况，我们会在后续文章中详细介绍。

（2）按值传递 (原始类型)

当向函数传递原始数据类型的值（如 String, Number, Boolean, Null, Undefined, Symbol, BigInt）时，传递的是该值的副本。这意味着在函数内部修改形参的值，不会影响到函数外部原始变量的值。

function modifyPrimitive(value) {
  value = value * 2; // 修改形参 value 的值
  console.log("函数内部 value:", value);
}

let originalNumber = 10;
console.log("调用前 originalNumber:", originalNumber); // 输出: 10
modifyPrimitive(originalNumber); // 将 originalNumber 的副本传递给 value
console.log("调用后 originalNumber:", originalNumber); // 输出: 10 (原始值未改变)

（3）按共享传递（对象类型，常被称为“按引用传递”）

当向函数传递对象类型的值（如 Object, Array, Function等）时，传递的是该对象在内存中的地址（引用）的副本。这意味着形参和实参指向的是内存中的同一个对象。

如果在函数内部修改了该对象的属性，这些改动会反映到函数外部的原始对象上，因为它们指向同一个实体。
但是，如果在函数内部将形参重新赋值为一个全新的对象，那么形参将指向这个新对象，而函数外部的原始变量仍然指向原来的对象，两者之间的联系就断开了。

// 示例1: 修改对象属性
function modifyObjectProperty(obj) {
  obj.property = "已修改"; // obj 和 originalObject 指向同一个对象，修改其属性
}

let originalObject = { property: "原始值" };
console.log("调用前 originalObject.property:", originalObject.property); // 输出: 原始值
modifyObjectProperty(originalObject);
console.log("调用后 originalObject.property:", originalObject.property); // 输出: 已修改 (原始对象的属性被改变了)

// 示例2: 在函数内重新赋值形参
function reassignObjectParameter(obj) {
  obj = { newProperty: "新对象" }; // 形参 obj 现在指向了一个全新的对象
  console.log("函数内部 obj:", obj);
}

let anotherObject = { property: "初始值" };
console.log("调用前 anotherObject:", anotherObject); // 输出: {property: "初始值"}
reassignObjectParameter(anotherObject);
console.log("调用后 anotherObject:", anotherObject); // 输出: {property: "初始值"} (原始对象未受影响)

理解这一点对于避免在处理对象和数组时产生意外的副作用非常重要。

4.3 `arguments` 对象 (简介)

在每个（非箭头）函数内部，都可以访问一个名为 arguments 的特殊对象。

4.3.1 什么是 `arguments` 对象？

arguments 对象是一个类数组对象 (array-like object)，它包含了函数在被调用时传入的所有实际参数，无论函数定义中是否有对应的形参。

类数组：意味着它有 length 属性，可以通过索引（如 arguments[0]）访问元素，但它并不是一个真正的数组实例，所以不能直接使用数组的所有方法（如 forEach, map 等），除非先将其转换为真正的数组（例如使用 Array.from(arguments)）。
它还拥有一个 callee 属性，指向当前正在执行的函数本身（但在严格模式下访问 arguments.callee 会抛出错误，不推荐使用）。

4.3.2 `arguments` 对象的应用场景

在 ES6 引入剩余参数 (...restParameter) 之前，arguments 对象是处理函数不定数量参数的主要方式。

示例：创建一个可以对任意数量数字求和的函数

function sumAllNumbers() {
  let total = 0;
  for (let i = 0; i < arguments.length; i++) {
    // 检查参数是否为数字，以增加健壮性
    if (typeof arguments[i] === 'number') {
      total += arguments[i];
    }
  }
  return total;
}

console.log(sumAllNumbers(1, 2, 3));          // 输出: 6
console.log(sumAllNumbers(10, 20, 30, 40, 50)); // 输出: 150
console.log(sumAllNumbers(5, "abc", 10));       // 输出: 15 (非数字参数被忽略)
console.log(sumAllNumbers());                   // 输出: 0

4.3.3 `arguments` 对象与箭头函数的区别

一个非常重要的区别是：箭头函数 (Arrow Functions) 没有自己的 arguments 对象。如果在箭头函数内部访问 arguments，它会引用其外层（最近的非箭头）函数的 arguments 对象（如果存在的话），或者在全局作用域下是未定义的。

这是箭头函数与传统函数的一个关键区别，在需要使用 arguments 对象的场景下，通常会选择传统函数声明或表达式。ES6 的剩余参数提供了更现代和直观的方式来处理可变数量的参数，我们将在后续文章中学习。

五、实际应用场景与常见问题

理论学习之后，我们来看看函数在实际项目中的应用以及可能遇到的一些问题。

5.1 函数在项目中的应用

函数是构建任何有意义的 JavaScript 应用程序的基础。

5.1.1 封装通用逻辑

将项目中多处用到的通用逻辑封装成函数，可以提高代码复用性和可维护性。
示例：一个简单的输入验证函数

function isValidEmail(email) {
  if (typeof email !== 'string') {
    return false;
  }
  // 简单的邮箱格式校验 (实际场景可能需要更复杂的正则表达式)
  const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
  return emailRegex.test(email);
}

console.log(isValidEmail("test@example.com")); // true
console.log(isValidEmail("invalid-email"));    // false
console.log(isValidEmail(123));                // false

这个 isValidEmail 函数可以在表单提交、用户注册等多个地方被调用。

5.1.2 事件处理

在网页开发中，函数经常用作事件处理程序，响应用户的操作（如点击按钮、输入文本等）。
示例：按钮点击事件处理 (概念性)

// 假设有一个按钮元素
// const myButton = document.getElementById('myButton');

function handleButtonClick() {
  console.log("按钮被点击了！");
  // 可以在这里执行更复杂的操作，如发送数据、更新页面内容等
}

// 在JavaScript中，我们会将这个函数绑定到按钮的点击事件上
// (具体的DOM操作和事件绑定将在后续DOM章节详细介绍)
// if (myButton) {
//   myButton.addEventListener('click', handleButtonClick);
// }

5.1.3 模块化开发

函数是实现模块化的基本手段之一。通过将相关功能组织到不同的函数中，再将这些函数组织到模块中，可以构建出结构清晰、易于管理的大型应用程序。

5.2 常见问题与排查

5.2.1 函数未定义 (ReferenceError)

原因：
- 函数名拼写错误。
- 对于函数表达式，在变量赋值之前就尝试调用函数。
- 函数定义在不同的作用域，当前作用域无法访问。
排查与解决：
- 仔细检查函数名的拼写和大小写。
- 确保函数表达式在使用前已经被定义和赋值。
- 检查函数的作用域，确保在可访问的范围内调用。

5.2.2 参数传递错误

原因：
- 传递的实参数量与函数期望的形参数量不符，导致某些形参为 undefined 或某些实参被忽略。
- 传递的实参类型与函数内部逻辑期望的类型不符，可能导致运行时错误或非预期结果（例如，期望数字却传入了字符串）。
排查与解决：
- 在函数内部使用 console.log() 打印接收到的参数值和类型，进行调试。
- 仔细阅读函数定义，明确所需的参数个数和类型。
- 使用默认参数或在函数内部进行参数校验，以增强函数的健壮性。
- 对于更复杂的项目，可以考虑使用 JSDoc 注释或 TypeScript 等工具来提供类型提示和检查。

5.2.3 `this` 指向问题 (简单提及，非本篇重点)

原因：在 JavaScript 中，函数内部 this 关键字的指向是动态的，它取决于函数是如何被调用的，而不是在哪里被定义的。这对于初学者来说常常是一个困惑点。
简单说明：对于普通函数调用（如 myFunction()），在非严格模式下 this 通常指向全局对象（浏览器中是 window），在严格模式下是 undefined。当作为对象方法调用时（如 obj.myMethod()），this 指向该对象。
提示：this 的详细行为和箭头函数对 this 的特殊处理，我们将在后续专门的章节中深入探讨。目前，只需意识到它可能是一个问题来源即可。

六、总结

函数是 JavaScript 编程中不可或缺的核心概念，它们为我们提供了强大的代码组织和复用能力。通过本篇文章的学习，我们掌握了：

函数是代码复用的基本单元：通过将一系列操作封装在一个命名的代码块中，函数实现了代码的模块化、可读性和可维护性。它避免了代码冗余，使得程序更加高效。
两种主要的函数创建方式：
- 函数声明 (function name() {})：具有函数提升的特性，允许在声明之前调用。
- 函数表达式 (const name = function() {};)：遵循变量的提升规则（变量名提升，函数体不提升），通常在赋值后才能调用。
函数调用是执行函数代码的途径：通过函数名后加圆括号 () 来调用函数，并可以在括号中传递实际参数。
参数是函数与外部数据交互的桥梁：
- 形参 (Parameters)：在函数定义时声明，作为函数内部的占位符。
- 实参 (Arguments)：在函数调用时传入的实际值，会赋给对应的形参。
- JavaScript 对参数数量比较灵活，未传递的形参默认为 undefined。
- 原始类型按值传递，对象类型按共享传递（引用副本）。
arguments 对象：在传统函数内部可访问，它是一个类数组对象，包含了所有传入的实际参数，为处理不定数量参数提供了一种方式（尽管 ES6 剩余参数更为推荐）。箭头函数没有自己的 arguments 对象。