Funzioni in

Informazioni su Funzioni

Una funzione è un blocco di codice organizzato e riutilizzabile che serve a eseguire una qualche azione. In JavaScript ci sono diversi modi per definire le funzioni. Qui vedremo le dichiarazioni di funzione e le espressioni di funzione. Altre possibilità, come le funzioni freccia, saranno trattate in altri concetti.

Dichiarazione di funzione

Il modo standard per definire una funzione in JavaScript è la dichiarazione di funzione, chiamata anche definizione di funzione o istruzione di funzione.

È composta dalla parola chiave function, dal nome della funzione e da un elenco di parametri separati da virgole racchiuso tra parentesi tonde. Segue il corpo della funzione (l'insieme delle istruzioni che definisce cosa fa una funzione) racchiuso tra parentesi graffe.

function someName(param1, param2, param3) {
  // ...
}

Usare una funzione

In JavaScript, una funzione si chiama scrivendo il nome della funzione seguito da parentesi tonde che contengono gli argomenti.

someName(arg1, arg2, arg3);

Scrivere soltanto il nome della funzione non la chiama in JavaScript.

function sayHello() {
  console.log('Hello, World!');
}

sayHello;
// => [Function: sayHello]
// The text representations varies between environments.

sayHello();
// => 'Hello, World!'

Parametri

Quando lavori con i parametri all'interno del corpo della funzione, tieni presente i possibili effetti collaterali sul valore originale che è stato passato alla funzione. In JavaScript, un argomento è una copia di un riferimento al valore originale. Ciò che questo significa in pratica dipende dal tipo di dato dell'argomento.

• I valori dei tipi di dati primitivi sono immutabili. Tutte le «modifiche» creano sempre un nuovo valore primitivo. Per questo motivo, il valore originale non è mai influenzato da ciò che accade all'argomento all'interno del corpo della funzione.

  const num = 0;
  
  function increase(number) {
    number = number + 1;
  }
  
  increase(num);
  num;
  // => 0
  

• È diverso per valori come oggetti, array e funzioni. Poiché il riferimento viene copiato, una riassegnazione non influenzerà il valore originale. Tuttavia, poiché hai a che fare con una copia superficiale, modificare l'argomento all'interno del corpo della funzione cambierà anche il valore originale che è stato passato.

  const nums = [0, 1, 2, 3, 4];
  
  function pushFive(arr) {
    arr.push(5);
  }
  
  pushFive(nums);
  nums;
  // => [0, 1, 2, 3, 4, 5]
  

Per impostazione predefinita, in JavaScript tutti i parametri definiti nella dichiarazione di funzione sono opzionali. Se a una funzione vengono passati meno argomenti di quanti sono i parametri, gli argomenti mancanti saranno undefined all'interno del corpo della funzione, vedi Null e Undefined. In molti casi, ha più senso inizializzare un parametro con un valore predefinito se non viene passato alcun valore o una proprietà undefined. Questo si può fare specificando parametri predefiniti direttamente nella definizione della funzione.

function someName(param1 = defaultValue1, param2 = defaultValue2) {
  // ...
}

Una funzione si può chiamare con più argomenti di quanti fossero i parametri nella definizione della funzione. Tutti gli argomenti, compresi quelli in eccesso, si possono trovare nell'«array» arguments.

È anche possibile definire funzioni che accettano un numero arbitrario di argomenti (funzioni variadiche); per maggiori dettagli, vedi i parametri rest in Operatori rest e spread.

Istruzione return

Un'istruzione return termina l'esecuzione della funzione e specifica un valore da restituire a chi ha chiamato la funzione. Una funzione può avere più istruzioni return.

function checkNumber(num) {
  if (num === 0) {
    return 'You passed 0, please provide another number.';
  }

  return 'Thanks for passing such a nice number.';
}

Il risultato di una funzione che non restituisce alcun valore, o che non ha un'istruzione return, è undefined. In JavaScript non esistono return impliciti.

function nakedReturn(a) {
  a * 2;
  return;
}

nakedReturn(1);
// => undefined

function noReturn(a) {
  a * 2;
}

noReturn(1);
// => undefined

In JavaScript, puoi restituire esattamente un solo valore. Se vuoi passare più informazioni, devi prima combinarle in un'unica entità, di solito in un oggetto o in un array.

function divide(a, b) {
  return {
    quotient: Math.floor(a / b),
    remainder: a % b,
  };
}

Espressione di funzione

Una dichiarazione di funzione è un'istruzione a sé stante. Ma a volte è utile definire una funzione come parte di un'altra espressione, ad esempio in un'assegnazione, come parametro di funzione (callback) o come valore in un oggetto. Questo si può fare con un'espressione di funzione. Ha la stessa sintassi di una dichiarazione di funzione, con la sola differenza che il nome della funzione può essere omesso per creare una funzione anonima.

const someFunction = function (param) {
  // ...
};

someOtherFunction(function (param) {
  // ...
});

const obj = {
  someFunction: function (param) {
    // ...
  },
};

Scope

Una funzione introduce un nuovo contesto di esecuzione in JavaScript. Le variabili definite all'interno di una funzione non sono accessibili dall'esterno di quella funzione. Ma le variabili definite nello scope genitore (lo scope in cui la funzione stessa è stata definita) sono accessibili all'interno della funzione. La documentazione MDN sullo scope mostra esempi di questo comportamento.

Dai un'occhiata alle closure per saperne di più sullo scope delle variabili in JavaScript.