17370845950

JavaScript剩余参数（...）是函数定义时接收末尾不定数量实参的正式机制，返回真数组，必须位于参数列表末位，与arguments本质不同，优先使用。

什么是 JavaScript 剩余参数（...）？

剩余参数不是语法糖，也不是数组解构的变体，它是函数定义时用 ... 接收**末尾不定数量实参**的正式机制，返回一个真数组（Array 实例），可直接调用 .map()、.reduce() 等方法。

它和 arguments 对象有本质区别：arguments 是类数组、非真数组、没有数组方法，且在箭头函数中不可用；而剩余参数只捕获“未被单独声明的参数”，更可控、更现代。

如何用 ... 正确接收不定参数？

必须放在函数参数列表**最后一位**，前面可以有任意个具名参数，但不能有其他参数跟在后面。否则会报 SyntaxError: Rest parameter must be last formal parameter。

• function sum(a, b, ...nums) { } ✅ 合法：前两个是固定参数，nums 接收剩余所有
• function bad(...nums, a) { } ❌ 语法错误
• function alsoBad(a, ...nums, b) { } ❌ 同样非法

常见误用是试图把它当“万能兜底”，结果忘了位置限制，直接导致代码无法运行。

剩余参数 vs arguments：何时该选谁？

优先用剩余参数。只有两种情况才考虑 arguments：

• 需要兼容非常老的环境（如 IE8 及以下），而你又不能用 Babel 编译
• 要读取 arguments.callee（已废弃，不推荐）

其余所有场景——包括想获取所有参数、做参数转发、求和、拼接、过滤——都该用 ...。例如实现参数透传：

function wrapper(...args) {
  console.log('calling with', args);
  return originalFunction(...args); // 这里也用展开运算符
}

注意：...args 在调用时是**展开（spread）**，在定义时是**剩余（rest）**，符号一样，语义相反。

容易忽略的细节和边界行为

剩余参数不会捕获 undefined 占位带来的“空槽”。比如调用 fn(1, , 3)（中间传了逗号但没值），实际只收到 [1, 3]；JS 会跳过缺失项，不会塞进 undefined。

• 传入 undefined 显式值：fn(1, undefined, 3) → ...rest 得到 [undefined, 3]
• 传入 null、0、false 都会被如实收录
• 空调用 fn() → rest 是空数组 []，不是 undefined

最常踩的坑是默认参数与剩余参数混用时逻辑错乱，比如写成 function f(a = 1, ...rest)，这时 a 不再是“必填”，但 rest 依然只从第 2 个实参开始收——这个边界得手动对齐，别依赖直觉。