JavaScript 剩余参数:如何处理不定数量的函数参数

剩余参数是javaScript中用于收集函数多余参数的数组,语法为…parameterName,必须位于参数末尾,可直接调用数组方法,区别于非数组的arguments对象,且支持与固定参数共存,提升代码可读性与安全性。

JavaScript 剩余参数:如何处理不定数量的函数参数

javascript 中的剩余参数(Rest Parameters)提供了一种简洁的方式处理函数中不确定数量的参数。通过使用三个点 (…) 加上一个形参名,可以把调用时传入的多个实参收集为一个数组,便于后续操作。

什么是剩余参数

剩余参数语法允许我们将一个不定数量的参数表示为一个数组。它出现在函数定义的最后一个参数前,格式为 …parameterName

例如:

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

sum(1, 2, 3); // 返回 6
sum(4, 5); // 返回 9
sum(); // 返回 0

在这个例子中,…numbers 将所有传入的参数收集为一个数组,然后使用 reduce() 方法计算总和。

立即学习Java免费学习笔记(深入)”;

与 arguments 对象的区别

在剩余参数出现之前,开发者通常使用函数内部的 arguments 对象来访问所有参数。但 arguments 不是真正的数组,不能直接调用如 mapFilter 等数组方法。

剩余参数的优势在于:

  • 它是真正的数组,可以直接使用数组方法
  • 语法更清晰,意图更明确
  • 可以和其他形参共存,只收集未命名的参数

示例对比:

JavaScript 剩余参数:如何处理不定数量的函数参数

即构数智人

即构数智人是由即构科技推出的AI虚拟数字人视频创作平台,支持数字人形象定制、短视频创作、数字人直播等。

JavaScript 剩余参数:如何处理不定数量的函数参数 36

查看详情 JavaScript 剩余参数:如何处理不定数量的函数参数

// 使用 arguments
function concatWithArgs() {
  return Array.prototype.slice.call(arguments).join(‘ ‘);
}

// 使用剩余参数
function concat(…parts) {
  return parts.join(‘ ‘);
}

结合其他参数使用

剩余参数必须是函数的最后一个参数,前面可以有其他固定参数。

比如,你想让第一个参数作为分隔符,后面的是要连接的内容:

function joinStrings(separator, …words) {
  return words.join(separator);
}

joinStrings(‘-‘, ‘a’, ‘b’, ‘c’); // 返回 ‘a-b-c’
joinStrings(‘ ‘, ‘Hello’, ‘world’); // 返回 ‘Hello world’

这里 separator 接收第一个参数,其余的都被 …words 收集。

注意事项

使用剩余参数时需要注意以下几点:

  • 每个函数只能有一个剩余参数,且必须位于参数列表末尾
  • 剩余参数不能出现在解构或默认值之后
  • 箭头函数也支持剩余参数
  • 错误示例:

    // 错误:剩余参数不在最后
    function badFunc(…rest, last) { } // SyntaxError

    // 错误:两个剩余参数
    function anotherBad(…a, …b) { } // SyntaxError

    基本上就这些。剩余参数让处理可变参数变得更直观、更安全,推荐在需要接收任意数量参数时优先使用。不复杂但容易忽略细节。

上一篇
下一篇
text=ZqhQzanResources