Introducció

Les funcions són blocs de codi reutilitzables que permeten estructurar millor els programes, millorar la llegibilitat i evitar la duplicació de codi. En aquesta secció, aprendrem com definir i cridar funcions en JavaScript.

Definició de Funcions

Sintaxi Bàsica

Per definir una funció en JavaScript, utilitzem la paraula clau function seguida del nom de la funció, parèntesis i un bloc de codi entre claus:

function nomDeLaFunció() {
    // codi a executar
}

Exemple

function saludar() {
    console.log("Hola, món!");
}

En aquest exemple, hem definit una funció anomenada saludar que imprimeix "Hola, món!" a la consola.

Crida de Funcions

Per cridar una funció, simplement escrivim el nom de la funció seguit de parèntesis:

saludar(); // Output: Hola, món!

Funcions amb Paràmetres

Les funcions poden acceptar paràmetres, que són valors que es passen a la funció quan es crida. Aquests paràmetres es defineixen dins dels parèntesis de la definició de la funció.

Exemple

function saludarNom(nom) {
    console.log("Hola, " + nom + "!");
}

saludarNom("Anna"); // Output: Hola, Anna!

En aquest exemple, la funció saludarNom accepta un paràmetre nom i imprimeix un missatge personalitzat.

Funcions amb Valors de Retorn

Les funcions poden retornar un valor utilitzant la paraula clau return. Quan una funció retorna un valor, podem emmagatzemar aquest valor en una variable o utilitzar-lo directament.

Exemple

function sumar(a, b) {
    return a + b;
}

let resultat = sumar(3, 4);
console.log(resultat); // Output: 7

En aquest exemple, la funció sumar accepta dos paràmetres a i b, i retorna la seva suma. El valor retornat es guarda a la variable resultat.

Exercicis Pràctics

Exercici 1: Funció de Salutació

Defineix una funció anomenada salutacioPersonalitzada que accepti dos paràmetres: nom i edat. La funció ha d'imprimir un missatge que digui "Hola, [nom]! Tens [edat] anys."

Solució

function salutacioPersonalitzada(nom, edat) {
    console.log("Hola, " + nom + "! Tens " + edat + " anys.");
}

salutacioPersonalitzada("Joan", 25); // Output: Hola, Joan! Tens 25 anys.

Exercici 2: Funció de Multiplicació

Defineix una funció anomenada multiplicar que accepti dos paràmetres x i y, i retorni el seu producte.

Solució

function multiplicar(x, y) {
    return x * y;
}

let producte = multiplicar(5, 6);
console.log(producte); // Output: 30

Errors Comuns i Consells

  1. Oblidar els Parèntesis en la Crida de la Funció: Recorda sempre incloure els parèntesis quan cridis una funció, fins i tot si no té paràmetres.

    saludar; // Incorrecte
    saludar(); // Correcte
    
  2. No Retornar un Valor: Si la teva funció ha de retornar un valor, assegura't d'utilitzar la paraula clau return.

    function sumar(a, b) {
        a + b; // Incorrecte
    }
    
    function sumarCorrecte(a, b) {
        return a + b; // Correcte
    }
    
  3. Paràmetres No Definits: Assegura't de passar els arguments necessaris quan cridis una funció que requereixi paràmetres.

    saludarNom(); // Incorrecte, falta el paràmetre 'nom'
    saludarNom("Anna"); // Correcte
    

Resum

En aquesta secció, hem après com definir i cridar funcions en JavaScript, com passar paràmetres a les funcions i com retornar valors des de les funcions. Les funcions són una eina fonamental per estructurar i reutilitzar el codi de manera eficient. En la següent secció, explorarem les expressions de funció i les funcions fletxa, que ofereixen maneres més concises de definir funcions.

JavaScript: De Principiant a Avançat

Mòdul 1: Introducció a JavaScript

Mòdul 2: Estructures de Control

Mòdul 3: Funcions

Mòdul 4: Objectes i Arrays

Mòdul 5: Objectes i Funcions Avançades

Mòdul 6: El Model d'Objectes del Document (DOM)

Mòdul 7: APIs del Navegador i Temes Avançats

Mòdul 8: Proves i Depuració

Mòdul 9: Rendiment i Optimització

Mòdul 10: Frameworks i Llibreries de JavaScript

Mòdul 11: Projecte Final

© Copyright 2024. Tots els drets reservats