JavaScript Academy · Lezione

Funzioni pure ed effetti collaterali

Scriva funzioni prevedibili e verificabili.

Funzioni pure ed effetti collaterali è una lezione JavaScript Academy gratuita su CoddyKit. Questa è la lezione 1 di 4. Puoi leggere la lezione completa qui gratuitamente — poi esercitati direttamente nel browser con un editor di codice integrato e un tutor IA disponibile 24/7. Fa parte del percorso di apprendimento JavaScript Academy, e i tuoi progressi si sincronizzano tra il web e l'app CoddyKit. Il corso JavaScript Academy include 4 lezioni in totale.

Che cosa rende pura una funzione

Una funzione pura ha due proprietà: dati gli stessi input, restituisce sempre lo stesso output e non produce effetti collaterali osservabili. Le funzioni pure sono prevedibili e facili da testare.

function add(a, b) {
  return a + b;
}
console.log(add(2, 3));
console.log(add(2, 3)); // always 5

Output deterministico

La purezza implica il determinismo. Gli stessi argomenti devono sempre corrispondere allo stesso risultato, senza dipendere da stato nascosto, tempo o casualità.

function double(n) {
  return n * 2;
}
console.log(double(10)); // always 20

Che cos'è un effetto collaterale

Un effetto collaterale è qualsiasi operazione che una funzione esegue oltre a restituire un valore: scrivere log, modificare stato esterno, scrivere nello storage, effettuare chiamate di rete o modificare i propri argomenti.

let total = 0;
function impureAdd(n) {
  total += n;     // side effect: mutates outer state
  return total;
}
console.log(impureAdd(5));
console.log(impureAdd(5)); // 5 then 10, not pure

Dipendere da stato esterno

Anche leggere uno stato esterno modificabile compromette la purezza, perché l'output cambia anche quando l'argomento rimane invariato.

let rate = 1.5;
function priceImpure(x) {
  return x * rate; // depends on outside variable
}
console.log(priceImpure(10)); // 15
rate = 2;
console.log(priceImpure(10)); // 20 - different result

Rendere pura una funzione

Passi come argomenti tutto ciò di cui la funzione ha bisogno. In questo modo il risultato dipende solo dagli input.

function price(x, rate) {
  return x * rate;
}
console.log(price(10, 1.5)); // 15
console.log(price(10, 2));   // 20

Modificare gli argomenti non è puro

Modificare un oggetto o un array passato alla funzione è un effetto collaterale osservabile dal chiamante. Le funzioni pure lasciano invariati i propri input.

function impurePush(arr, x) {
  arr.push(x);   // mutates caller array
  return arr;
}
const a = [1, 2];
impurePush(a, 3);
console.log(a); // [1, 2, 3] - caller changed

Restituire nuovi valori

Una versione pura costruisce e restituisce un nuovo valore invece di modificare l'input.

function pureAppend(arr, x) {
  return [...arr, x];
}
const a = [1, 2];
const b = pureAppend(a, 3);
console.log(a); // [1, 2] unchanged
console.log(b); // [1, 2, 3]

Perché la purezza è utile

Le funzioni pure sono semplicissime da testare (senza configurazione né mock), sicure da memorizzare nella cache (con memoization) e sicure da eseguire in qualsiasi ordine o in parallelo. Rendono il ragionamento sul codice locale.

function square(n) { return n * n; }
console.log([1, 2, 3].map(square)); // [1, 4, 9]

Isolare l'impurità

Non è possibile evitare tutti gli effetti collaterali: le applicazioni devono scrivere log, recuperare dati e eseguire il rendering. L'obiettivo è spostare gli effetti ai margini e mantenere pura la logica centrale.

function computeTotal(items) {
  return items.reduce((s, i) => s + i.price, 0);
}
const total = computeTotal([{ price: 5 }, { price: 7 }]);
console.log(total); // 12 - pure core, log at the edge

Trasparenza referenziale

Una chiamata pura può essere sostituita dal proprio risultato senza modificare il comportamento. add(2, 3) è intercambiabile con 5 in qualsiasi punto. Questa proprietà si chiama trasparenza referenziale.

function add(a, b) { return a + b; }
const x = add(2, 3) + add(2, 3);
const y = 5 + 5;
console.log(x === y); // true

Riconoscere l'impurità

Faccia attenzione a questi indicatori: console, Math.random, Date.now, assegnazioni a variabili esterne o modifiche degli argomenti. Ognuno di questi elementi rende impura una funzione.

function pureRoll(seed) {
  return (seed * 1103515245 + 12345) % 100;
}
console.log(pureRoll(42)); // deterministic, testable

Verifica rapida

Riconoscere le funzioni pure.

Riepilogo

Le funzioni pure sono deterministiche e prive di effetti collaterali: non modificano dati esterni, non eseguono I/O e non modificano gli argomenti. Passi le dipendenze come argomenti e restituisca nuovi valori invece di modificare quelli esistenti. La purezza offre testabilità, memoization, trasparenza referenziale e sicurezza nell'esecuzione parallela. Mantenga pura la logica centrale e sposti gli effetti ai margini.

Domande Frequenti

La lezione «Funzioni pure ed effetti collaterali» è gratuita?

Sì — il testo completo di «Funzioni pure ed effetti collaterali» è gratuito qui sul web. Per esercitarvi in modo interattivo (un editor di codice integrato e un tutor IA 24/7) e sbloccare il resto del corso JavaScript Academy, passa a CoddyKit PRO. Il corso JavaScript Academy include 4 lezioni in totale.

Cosa imparerò in «Funzioni pure ed effetti collaterali»?

Scriva funzioni prevedibili e verificabili. Eserciti JavaScript Academy con codice pratico che esegui direttamente nel browser, e un tutor IA 24/7 risponde alle tue domande mentre lavori sulla lezione.

Ho bisogno di esperienza per iniziare JavaScript Academy?

Non è richiesta alcuna esperienza precedente. JavaScript Academy su CoddyKit è strutturato per principianti e studenti avanzati, quindi puoi iniziare da qui o dall'inizio e procedere al tuo ritmo. Questa è la lezione 1 di 4.

Quanto tempo richiede la lezione «Funzioni pure ed effetti collaterali»?

La maggior parte delle lezioni CoddyKit richiede circa 5–10 minuti. Ogni lezione è breve e interattiva, quindi fai progressi costanti e riprendi esattamente da dove hai lasciato su web e app.

Posso scrivere ed eseguire codice in questa lezione JavaScript Academy?

Sì. Ogni lezione JavaScript Academy include un editor di codice integrato, quindi scrivi ed esegui codice reale direttamente nel tuo browser e ricevi feedback istantaneo dall'IA — nessuna configurazione locale necessaria.

Tutte le lezioni di questo corso

← Torna a JavaScript Academy