Rest 参数是 ECMAScript 6 中新增的一个语法特性，可以让我们更方便地处理函数参数。在 TypeScript 中，我们可以使用 Rest 参数来更好地处理函数参数类型，提高代码的可读性和可维护性。
Rest 参数的基础用法
Rest 参数可以让我们将不定数量的参数表示为一个数组，示例如下：
function sum(...numbers: number[]) {
return numbers.reduce((a, b) => a + b, 0);
}
sum(1, 2, 3, 4); // 10
sum(1, 2); // 3
sum(); // 0在上面的代码中，我们使用了 Rest 参数 ...numbers 来表示函数的所有参数，并将它们放在一个数组中。在函数体内，我们可以像操作普通数组一样来操作 numbers 数组，例如使用 reduce 方法来求和。
Rest 参数的高级用法
除了基础用法外，Rest 参数还有一些高级用法，可以让我们更好地处理函数参数类型。
Rest 参数与普通参数的结合使用
在函数定义中，Rest 参数可以和普通参数一起使用，但是需要注意的是，Rest 参数必须放在最后面，示例如下：
function join(separator: string, ...strings: string[]) {
return strings.join(separator);
}
join(", ", "foo", "bar", "baz"); // "foo, bar, baz"在上面的代码中，我们使用了一个普通参数 separator 和一个 Rest 参数 ...strings，并将它们结合起来来实现字符串的拼接。
Rest 参数与元组类型的结合使用
在 TypeScript 中，我们可以使用元组类型来表示具有固定数量和类型的数组。在函数定义中，我们可以使用 Rest 参数和元组类型的结合来更好地处理函数参数类型，示例如下：
type Point = [number, number];
function distance(...points: Point[]) {
return points.reduce((sum, [x, y]) => sum + Math.sqrt(x ** 2 + y ** 2), 0);
}
distance([0, 0], [1, 1], [2, 2]); // 3.41...在上面的代码中，我们使用了一个元组类型 Point 来表示一个由两个数字组成的点，使用 Rest 参数 ...points 来表示函数的所有参数，并将它们放在一个 Point 类型的数组中。在函数体内，我们可以使用解构赋值来获取点的坐标，并计算它们之间的距离。
Rest 参数与联合类型的结合使用
在 TypeScript 中，我们可以使用联合类型来表示多种类型中的一种。在函数定义中，我们可以使用 Rest 参数和联合类型的结合来更好地处理函数参数类型，示例如下：
-- -------------------- ---- -------
---- ----- - - ----- --------- ------- ------ - - - ----- --------- ----- ------ --
-------- --------------- -------- -
------ ------------------- ------ -- -
------ ------------ -
---- ---------
------ --- - ------- - ------------ -- --
---- ---------
------ --- - ---------- -- --
-
-- ---
-
------ ----- --------- ------- - -- - ----- --------- ----- - --- -- -------在上面的代码中，我们使用了一个联合类型 Shape 来表示圆和正方形，使用 Rest 参数 ...shapes 来表示函数的所有参数，并将它们放在一个 Shape 类型的数组中。在函数体内，我们可以使用 switch 语句来根据形状的种类来计算面积。
总结
Rest 参数是 TypeScript 中非常有用的语法特性，可以让我们更好地处理函数参数类型。在使用 Rest 参数时，我们不仅可以使用基础用法，还可以结合普通参数、元组类型和联合类型等高级用法，提高代码的可读性和可维护性。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6505a71d95b1f8cacd203811