Els paràmetres rest són una característica poderosa de TypeScript (i JavaScript) que permet a una funció acceptar un nombre variable d'arguments com un array. Aquesta funcionalitat és especialment útil quan no es coneix per endavant el nombre d'arguments que es passaran a la funció.
Conceptes Clau
-
Sintaxi dels Paràmetres Rest:
- Els paràmetres rest es defineixen utilitzant els tres punts (
...
) seguits del nom del paràmetre. - Aquest paràmetre es converteix en un array que conté tots els arguments addicionals passats a la funció.
- Els paràmetres rest es defineixen utilitzant els tres punts (
-
Ús dels Paràmetres Rest:
- Es poden utilitzar per agrupar arguments en una funció.
- Faciliten la creació de funcions que poden treballar amb un nombre variable d'arguments.
Exemple Pràctic
Definició d'una Funció amb Paràmetres Rest
function sumar(...nombres: number[]): number { return nombres.reduce((acc, curr) => acc + curr, 0); } console.log(sumar(1, 2, 3)); // Sortida: 6 console.log(sumar(10, 20, 30, 40)); // Sortida: 100
Explicació del Codi
-
Definició de la Funció:
- La funció
sumar
accepta un nombre variable d'arguments de tipusnumber
. - El paràmetre
...nombres
es converteix en un array de números.
- La funció
-
Reducció de l'Array:
- La funció
reduce
s'utilitza per sumar tots els elements de l'arraynombres
. acc
és l'acumulador que guarda la suma parcial.curr
és l'element actual de l'array que s'està processant.
- La funció
-
Crides a la Funció:
sumar(1, 2, 3)
retorna6
perquè suma1 + 2 + 3
.sumar(10, 20, 30, 40)
retorna100
perquè suma10 + 20 + 30 + 40
.
Exercicis Pràctics
Exercici 1: Concatenar Strings
Escriu una funció concatenar
que accepti un nombre variable de strings i els concateni en un sol string.
function concatenar(...strings: string[]): string { // Escriu el teu codi aquí } // Prova la funció console.log(concatenar("Hola", " ", "món", "!")); // Sortida: "Hola món!"
Solució
function concatenar(...strings: string[]): string { return strings.join(''); } console.log(concatenar("Hola", " ", "món", "!")); // Sortida: "Hola món!"
Exercici 2: Trobar el Màxim
Escriu una funció trobarMaxim
que accepti un nombre variable de números i retorni el valor màxim.
function trobarMaxim(...nombres: number[]): number { // Escriu el teu codi aquí } // Prova la funció console.log(trobarMaxim(1, 5, 3, 9, 2)); // Sortida: 9
Solució
function trobarMaxim(...nombres: number[]): number { return Math.max(...nombres); } console.log(trobarMaxim(1, 5, 3, 9, 2)); // Sortida: 9
Errors Comuns
-
Oblidar els Tres Punts:
- Si oblides els tres punts (
...
), TypeScript no reconeixerà el paràmetre com un paràmetre rest i generarà un error.
function sumar(nombres: number[]): number { // Error return nombres.reduce((acc, curr) => acc + curr, 0); }
- Si oblides els tres punts (
-
Tipus Incorrectes:
- Assegura't que el tipus del paràmetre rest és correcte. Per exemple, si esperes números, utilitza
number[]
.
function sumar(...nombres: string[]): number { // Error return nombres.reduce((acc, curr) => acc + curr, 0); }
- Assegura't que el tipus del paràmetre rest és correcte. Per exemple, si esperes números, utilitza
Resum
Els paràmetres rest són una característica útil que permet a les funcions acceptar un nombre variable d'arguments. Utilitzant els tres punts (...
), pots agrupar aquests arguments en un array i processar-los fàcilment dins de la funció. Aquesta funcionalitat és especialment útil per a funcions que necessiten ser flexibles en el nombre d'arguments que accepten.
Curs de TypeScript
Mòdul 1: Introducció a TypeScript
- Què és TypeScript?
- Configuració de l'entorn de TypeScript
- Tipus bàsics
- Anotacions de tipus
- Compilació de TypeScript
Mòdul 2: Treballant amb Tipus
Mòdul 3: Tipus Avançats
Mòdul 4: Funcions i Mòduls
- Tipus de Funció
- Paràmetres Opcional i per Defecte
- Paràmetres Rest
- Mòduls i Espais de Noms
- Decoradors
Mòdul 5: Programació Asíncrona
Mòdul 6: Eines i Millors Pràctiques
- Linting i Formatació
- Proves de Codi TypeScript
- TypeScript amb Webpack
- TypeScript amb React
- Millors Pràctiques