JavaScript箭头函数传递剩余参数的常见用法与示例

首先强调核心要点：箭头函数完全支持接收剩余参数（rest parameters），语法为...args，且该参数必须位于形参列表的最后。剩余参数是一个真正的数组，而非类数组对象，因此可以直接调用数组方法。如果不传递任何实参，它默认是一个空数组，不会返回undefined。由于箭头函数内部没有自己的arguments对象，剩余参数便成为访问所有传入实参的唯一标准途径。

箭头函数同样可以接收剩余参数，其语法与普通函数完全一致，只需使用...args形式即可。

箭头函数中使用剩余参数的写法

剩余参数必须位于形参列表的最后，且前面不能存在其他具名参数——除非借助解构或默认值来配合使用。

• 例如正确写法：const sum = (...nums) => nums.reduce((a, b) => a + b, 0); 这种写法非常简洁明了。
• 当存在前置参数时，需注意顺序：const logWithPrefix = (prefix, ...messages) => console.log(prefix, ...messages);
• 避免错误写法如(...a, b) => {}，这会导致语法错误，编译器会直接报错。

剩余参数在箭头函数中的行为特点

剩余参数在箭头函数中的表现与普通函数完全一致，可以放心使用。它是一个真正的数组，而非类数组对象，因此能够直接调用map、filter等数组方法。

• ...args收集的是调用时传入的“额外”实参，不包含已命名的参数
• 如果没有传入任何实参，args将是一个空数组[]，而不是undefined
• 由于箭头函数没有自己的arguments对象，剩余参数便成为访问所有实参的唯一标准方式

常见误用与注意事项

最容易混淆的是剩余参数与展开语法，二者写法相似但语义完全不同。在箭头函数中，还需特别注意上下文绑定的问题。

• 不要在剩余参数之后添加默认值参数：(...rest, x = 1) => {} 是非法语法，编辑器会直接标红
• 若需要默认值，应将其放在剩余参数之前：(a = 1, ...rest) => {}
• 箭头函数不绑定this，但剩余参数本身不受影响——它只负责参数接收逻辑，与上下文无关