【JavaScript】剩余参数语法（Rest Parameters）详解

JavaScript 是一门灵活且强大的编程语言，在函数参数处理上也非常多样化。随着 ES6 的引入，剩余参数语法（Rest Parameters）成为处理可变数量参数的重要手段。相比传统的 arguments 对象，剩余参数语法更直观、更强大、更灵活，也更适合现代 JavaScript 编程风格。本文将详细介绍剩余参数的基本语法、使用场景、与 arguments 的区别及注意事项，帮助你全面掌握这一语法特性。

一、什么是剩余参数（Rest Parameters）

1. 基本定义

剩余参数是 ES6 引入的一种语法形式，用于将函数的多余参数收集到一个数组中。语法上通过在函数参数前加上三个点 ... 实现。

function sum(...numbers) {
   
   
  return numbers.reduce((total, num) => total + num, 0);
}

console.log(sum(1, 2, 3));       // 输出 6
console.log(sum(4, 5, 6, 7, 8)); // 输出 30

在上述例子中，sum 函数使用了剩余参数 ...numbers，无论传入多少个参数，它们都会被打包成一个数组 numbers，从而可以统一处理。

2. 与展开语法（Spread Syntax）的区别

虽然 ... 语法在形式上和展开语法类似，但它们的含义完全不同：

• 剩余参数：用于函数参数定义中，把“多余”的参数打包为数组。
• 展开语法：用于函数调用、数组、对象等场景，把数组或对象“拆开”。

function demo(...args) {
   
   
  console.log(args);
}

const arr = [1, 2, 3];
demo(...arr); // 展开语法：将数组拆开传入函数

// 输出：[1, 2, 3] （由于剩余参数会再次打包成数组）

二、剩余参数的基本语法规则

1. 只能出现在最后一个参数位置

在函数参数中，剩余参数必须是最后一个，否则会抛出语法错误：

function invalid(...rest, anotherArg) {
   
   
  // ❌ 报错：Rest parameter must be last formal parameter
}

正确的写法：

function valid(first, ...rest