JavaScript函数默认参数设置方法

JavaScript函数默认参数看似简单，实则暗藏多重陷阱：它仅在参数严格等于undefined时生效，null、0等falsy值均不触发；对象或数组作为默认值易引发引用共享污染，必须用??[]或显式判断确保每次新建实例；后续参数可安全引用前面参数，但反向引用会导致ReferenceError；解构赋值时若未为整个参数对象设置默认值（如= {}），传入null将直接抛出TypeError。掌握这些细节，才能写出健壮、可预测的默认参数逻辑。

JavaScript 函数默认参数怎么写才不会出错

ES6 开始支持函数默认参数，但很多人直接写 function fn(a = []) 就以为万事大吉——其实这在多数场景下是危险的。默认值只在参数为 undefined 时生效，null、false、0、空字符串都不会触发。

• 正确判断依据是：只有传参值严格等于 undefined，才会用默认值
• fn() → 触发默认值；fn(null) → 不触发，默认值被忽略
• 对象/数组作为默认值时，必须确保每次调用都生成新实例，否则会共享引用

避免默认数组/对象被多次调用污染

写成 a = [] 看似简洁，但若函数被反复调用且内部修改了这个数组，后续调用会拿到已被污染的旧数组。这不是 bug，是 JS 引用传递的自然结果。

function addItem(item, list = []) {
  list.push(item);
  return list;
}

addItem('a'); // ['a']
addItem('b'); // ['a', 'b'] ← 意外！复用了上一次的数组

正确做法是用工厂函数或短路逻辑确保每次新建：

• 推荐：list = list || []（但会把 false/0 等 falsy 值也转为空数组）
• 更安全：list = list === undefined ? [] : list
• 最清晰：list = list ?? []（ES2020 空值合并，仅对 null 和 undefined 生效）

默认参数能访问前面的参数吗

可以，但有顺序限制：后面的参数默认值能引用前面已声明的参数，反之不行。这是常见报错源头。

function greet(greeting = 'Hi', name = greeting + ', friend') {
  return name;
}
greet(); // 'Hi, friend' ✅

function bad(greeting = name, name = 'Alice') { // ReferenceError: Cannot access 'name' before initialization
  return greeting;
}

• 默认值表达式按从左到右顺序求值
• 不能跨参数反向引用，哪怕 name 在后面定义也不行
• 若需依赖关系复杂，建议在函数体内做判断，别硬塞进参数列表

和解构默认值混用时的坑

当函数参数是解构形式（如 { count = 1 } = {}），两层默认值容易混淆：一层是解构的默认值，一层是整个参数的默认值。

function load({ page = 1, size = 10 } = {}) {
  console.log(page, size);
}
load();        // 1 10 ✅
load({});       // 1 10 ✅
load({ page: 2 }); // 2 10 ✅
load(null);     // TypeError: Cannot destructure property 'page' of 'null' as it is null. ❌

• 解构本身不处理 null 或 undefined，必须给整个参数设默认值（如 = {}）才能兜底
• 如果允许 null 传入，得先做类型检查：function load(opts = {}) { const { page = 1 } = opts; ... }
• 别省略等号右边的空对象，否则 null 一来就崩

以上就是本文的全部内容了，是否有顺利帮助你解决问题？若是能给你带来学习上的帮助，请大家多多支持golang学习网！更多关于文章的相关知识，也可关注golang学习网公众号。