Funcions
Les funcions són trossos de codi amb nom: les escrius una vegada i les fas servir tantes vegades com vulguis. Són una de les eines més poderoses de qualsevol llenguatge de programació.
Per què fer servir funcions?
Imagina que has de saludar diverses persones en un programa. Sense funcions, hauries de repetir les mateixes línies una vegada per cada persona:
Repetir codi és un problema: si vols canviar el missatge, has de modificar-lo en tres llocs. Les funcions solucionen això seguint el principi DRY (Don't Repeat Yourself, no et repeteixis): escrius la lògica una vegada i la crides tantes vegades com calgui.
Definir una funció: function
Una funció es defineix amb la paraula clau function, seguida del nom de la funció, uns parèntesis i un bloc entre claus. El codi de dins és el que s'executarà cada vegada que la cridis:
Per cridar una funció, escrius el seu nom seguit dels parèntesis. Sense els parèntesis, la funció no s'executa.
Els noms de funcions en JavaScript segueixen la mateixa convenció que les variables: camelCase (primera lletra en minúscula, la primera de cada paraula següent en majúscula): saluda, liniaSeparadora, calculaArea.
Prova a modificar el missatge dins la funció i observa com canvia en totes tres crides alhora:
Paràmetres: fer funcions flexibles
Els paràmetres són variables especials que reben valors quan crides la funció. Es declaren dins dels parèntesis. Gràcies a ells, la mateixa funció pot treballar amb dades diferents cada vegada:
Quan crides saluda("Anna"), el valor "Anna" s'assigna al paràmetre nom dins de la funció. A la pròxima crida, nom valdrà "Bernat", i així successivament. Cada crida és independent.
Una funció pot tenir tants paràmetres com calgui, separats per comes. L'ordre importa: el primer valor que passes va al primer paràmetre, el segon al segon, etc.:
La diferència crucial: return vs console.log
Aquesta és la distinció més important de tot el capítol. Una funció pot imprimir un resultat o retornar-lo. Sembla el mateix, però no ho és.
Una funció que fa console.log() mostra el resultat a la consola, però el valor desapareix: no el pots guardar ni fer-lo servir en cap càlcul posterior. Mira aquest exemple:
La variable resultat val undefined, no 10 com t'esperaries! El console.log dins la funció ha imprès el 10, però no l'ha retornat.
Una funció amb return envia el valor de tornada al lloc on s'ha cridat. Llavors pots guardar-lo a una variable, fer-lo servir en una expressió o passar-lo a una altra funció:
Una altra cosa important: return finalitza la funció immediatament. Qualsevol codi després d'un return que s'executa no es farà mai. Això pot ser molt útil per sortir aviat d'una funció en certs casos:
Composició: funcions dins de funcions
Les funcions es poden cridar des de dins d'altres funcions. El programa entra a la funció interior, n'obté el resultat, i el fa servir a l'exterior. Això et permet construir funcions complexes a partir de funcions senzilles:
Aquest patró és tan útil que la majoria del codi del món està fet així: funcions petites que es combinen per fer feines més grans.
Valors per defecte
Pots donar a un paràmetre un valor per defecte, que s'utilitza si qui crida la funció no proporciona aquest argument:
És útil per a paràmetres opcionals. Si tots els paràmetres tenen valor per defecte, la funció es pot cridar sense cap argument.
Variables locals: el que passa dins, queda dins
Les variables que declares dins d'una funció (amb let o const) s'anomenen variables locals. Existeixen només mentre la funció s'executa i desapareixen quan acaba. No es poden veure des de fora:
L'última línia dona ReferenceError: la variable area només existia dins la funció.
Una cosa important: els paràmetres no necessiten tenir el mateix nom que la variable que passes a la crida. Cada funció té el seu propi món:
Errors típics
1. Usar console.log enlloc de return — la funció mostra el valor però no el retorna, així que guardar el resultat en una variable et dona undefined:
Sortida: 7, i després NaN (Not a Number). Això passa perquè undefined * 2 no és cap nombre vàlid. Si la funció hagués fet return a + b, tot funcionaria.
2. Cridar la funció sense parèntesis — sense () no estàs cridant la funció, sinó referint-t'hi com a objecte. El resultat és estrany:
S'imprimeix el codi de la funció sencer, no "Hola!". Si volem el valor que retorna la funció, hem d'escriure salutacio() amb parèntesis.
3. Passar menys arguments dels esperats — JavaScript no avisa, simplement assigna undefined al paràmetre que falta:
El resultat és "Anna té undefined anys.". JavaScript no peta; només mostra un text estrany. Si vols un valor per defecte sensat quan l'argument no es passa, usa la sintaxi del valor per defecte (secció 6).
Exercici
esPrimer(n) que retorni true si n és un nombre primer, i false en cas contrari.
Un nombre és primer si és més gran que 1 i no és divisible per cap nombre entre 2 i n - 1.
Per exemple:
esPrimer(2)→trueesPrimer(7)→trueesPrimer(10)→falseesPrimer(1)→false
Pista: fes servir un bucle for des de 2 fins a n - 1 i l'operador % per comprovar si n és divisible per algun nombre. Si trobes un divisor, retorna false immediatament. Si el bucle acaba sense trobar-ne cap, retorna true.
Resum
- Una funció es defineix amb
function nom() { ... }i es crida escrivintnom(). El codi de dins s'executa cada vegada que la crides. - Els paràmetres es declaren dins dels parèntesis i permeten passar dades a la funció a cada crida.
return valorenvia el resultat de tornada i acaba la funció. Sensereturn, la funció retornaundefined.- La diferència entre
console.logireturnés crucial:console.logmostra;returntorna el valor al codi que ha cridat la funció. - Pots donar valors per defecte als paràmetres:
function f(x = 0). - Les variables declarades dins d'una funció són locals: només existeixen mentre la funció s'executa.
- JavaScript no peta si crides una funció amb menys arguments dels esperats: els paràmetres no proporcionats valen
undefined.