4.2 默认参数、剩余参数（`...args`）

4.2 默认参数、剩余参数（...args）

ES6 引入了默认参数和剩余参数，极大地增强了 JavaScript 函数的灵活性和表达能力。默认参数允许为函数参数设置默认值，而剩余参数则允许将多个参数收集到一个数组中。本节将详细介绍这两种特性的用法和应用场景。

4.2.1 默认参数

默认参数允许在函数定义时为参数设置默认值。如果调用函数时未传递该参数，则使用默认值。

1. 基本用法

function greet(name = "Guest") {
  console.log(`Hello, ${name}!`);
}
greet(); // 输出 "Hello, Guest!"
greet("Alice"); // 输出 "Hello, Alice!"

2. 默认值为表达式
默认值可以是任意表达式，甚至是函数调用：

function getDefaultName() {
  return "Guest";
}
function greet(name = getDefaultName()) {
  console.log(`Hello, ${name}!`);
}
greet(); // 输出 "Hello, Guest!"

3. 默认参数与解构赋值结合
默认参数可以与解构赋值结合使用：

function createUser({ name = "Guest", age = 18 } = {}) {
  console.log(`Name: ${name}, Age: ${age}`);
}
createUser(); // 输出 "Name: Guest, Age: 18"
createUser({ name: "Alice", age: 25 }); // 输出 "Name: Alice, Age: 25"

4.2.2 剩余参数（...args）

剩余参数允许将多个参数收集到一个数组中，适用于处理不定数量的参数。

1. 基本用法

function sum(...numbers) {
  return numbers.reduce((acc, num) => acc + num, 0);
}
console.log(sum(1, 2, 3)); // 输出 6
console.log(sum(1, 2, 3, 4, 5)); // 输出 15

2. 剩余参数与其他参数结合
剩余参数必须是函数的最后一个参数：

function logInfo(name, age, ...hobbies) {
  console.log(`Name: ${name}, Age: ${age}`);
  console.log(`Hobbies: ${hobbies.join(", ")}`);
}
logInfo("Alice", 25, "reading", "coding", "traveling");
// 输出：
// Name: Alice, Age: 25
// Hobbies: reading, coding, traveling

3. 剩余参数与箭头函数
剩余参数可以与箭头函数结合使用：

const logArgs = (...args) => console.log(args);
logArgs(1, 2, 3); // 输出 [1, 2, 3]

4.2.3 默认参数与剩余参数的应用场景

1. 默认参数的应用场景

• 提供函数的默认行为。
• 减少对参数是否为 undefined 的检查。
• 与解构赋值结合，简化对象参数的默认值设置。

2. 剩余参数的应用场景

• 处理不定数量的参数。
• 替代 arguments 对象（箭头函数中没有 arguments）。
• 实现函数的重载或参数转发。

4.2.4 示例代码

示例 1：默认参数

function createPost(title, content = "No content provided", tags = []) {
  console.log(`Title: ${title}`);
  console.log(`Content: ${content}`);
  console.log(`Tags: ${tags.join(", ")}`);
}
createPost("My First Post");
// 输出：
// Title: My First Post
// Content: No content provided
// Tags:

示例 2：剩余参数

function joinStrings(separator, ...strings) {
  return strings.join(separator);
}
console.log(joinStrings("-", "Hello", "World", "!")); // 输出 "Hello-World-!"

4.2.5 总结

• 默认参数：为函数参数设置默认值，简化函数调用。
• 剩余参数：将多个参数收集到一个数组中，适用于处理不定数量的参数。
• 应用场景：默认参数用于提供默认行为，剩余参数用于处理不定数量的参数。

通过掌握默认参数和剩余参数，你可以编写更灵活、更易用的函数。在接下来的学习中，我们将继续探索 JavaScript 的其他高级特性。

思考题：

1. 默认参数的值可以是动态的吗？如果可以，如何实现？
2. 剩余参数和 arguments 对象有什么区别？
3. 在什么情况下应该使用剩余参数？