JavaScript 中的默认参数是 ES6 特性之一，它可以避免不必要的未定义错误，使代码更简洁，并简化函数调用。无论您是 JavaScript 新手，还是经验丰富的开发人员，想要优化代码，掌握默认参数都是必须的。
在本指南中，您将了解：
什么是默认参数
它们在 ES6+ 中如何工作
真实用例
应避免的常见陷阱
JavaScript 中的默认参数是什么？
默认形参允许您为函数中的参数设置默认值。如果参数没有指定值，或者显式设置为 undefined，则将使用默认值。
基本语法：
function greet(name = "Wisdom") {
return Hi, ${name}!;
}
console.log(greet()); // Output: Hi, Wisdom!
console.log(greet("Wisdom")); // Output: Hi, Wisdom!为什么使用默认参数？
默认参数可以帮助您：
避免手动检查undefined
编写更干净、更简短的代码
防止由于缺少参数而导致的运行时错误
提高代码可读性
没有默认参数：
function greet(name) {if (name === undefined) {
name = "Guest";}return Hi, ${name}!;
}使用默认参数：
function greet(name = "Wisdom") {
return Hi, ${name}!;
}多个默认参数
您可以在同一个函数中为多个参数设置默认值。
function createUser(name = "Wisdom", role = "Technical Writer") {
return { name, role };
}
console.log(createUser());// { name: "Wisdom", role: "Technical Writer" }
console.log(createUser("Udo"));// { name: "Udo", role: "Technical Writer" }使用表达式作为默认值
默认值不必硬编码；它们可以来自表达式甚至函数调用。
function getCurrentYear() {
return new Date().getFullYear();
}
function logYear(year = getCurrentYear()) {
console.log(year);
}
logYear(); // Current year (e.g., 2025)
logYear(2022); // 2022您应该知道的重要细节
顺序很重要（始终将没有默认值的参数放在有默认值的参数之前。）
当undefined传递时，使用默认值，但null没有效果。
function test(value = 23) {
console.log(value);
}
test(undefined); // 23
test(null); // nullES6 特性
ECMAScript 2015 中引入了默认参数。请确保您的环境支持它们，或者使用像 Babel 这样的转译器。
默认参数的实际用例
API 请求：将默认 HTTP 方法设置为 GET
数据处理功能：如果数据集缺失，则提供后备值
UI 渲染：内容仍在加载时显示默认文本或占位符。
例子：
function fetchData(url, method = "GET") {
console.log(Fetching from ${url} with ${method} request.);
}
fetchData("https://api.example.com");
// Fetching from https://api.example.com with GET request.常见问题 (FAQ)
问题 1：JavaScript 中的默认参数和可选参数是一回事吗？
答：不完全是。JavaScript 缺少可选参数，而 TypeScript
等语言中却有这个特性，但默认参数可以模仿这种行为。
问题 2：默认参数可以依赖于其他参数吗？
答：可以。
function multiply(a, b = a * 2) {
return a * b;
}
console.log(multiply(6)); // 72结论
JavaScript 中的默认参数虽然功能不多，但却十分强大，它可以让你的代码更简洁、更可预测、更易于维护。有效地使用默认参数，可以消除不必要的未定义检查，简化函数调用，并提高代码对参数缺失的适应能力。无论你是在构建 API、渲染 UI 组件还是处理数据，默认参数都可以帮助你编写灵活可靠的函数。