Immutabilità

Uno dei principi cardine della programmazione funzionale è l'assenza di
effetti collaterali nell'esecuzione del codice. Abbiamo visto nelle lezioni precedenti quali sono i vantaggi e come possiamo limitare la loro presenza.
Purtroppo il funzionamento stesso di alcune semplici istruzioni del
linguaggio (ma non solo di JavaScript) ci mettono in situazioni in cui non
possiamo fare a meno di generare effetti collaterali.

Prendiamo ad esempio l'assegnamento. Per tipi di dato primitivi, come
numeri, stringhe, booleani, ecc., l'assegnamento di un valore ad una
variabile è immune da potenziali effetti collaterali. Consideriamo il
seguente esempio:

var x = 32;
var y = x;
x = 12;
console.log(x); //12
console.log(y); //32

Il fatto di aver assegnato alla variabile y il valore della
variabile x non vincola le due variabili. Infatti, la modifica del
valore di x non ha influenza sul valore di y, che rimane
quello iniziale di 32.

Proviamo a fare un'operazione analoga per tipi di dato complessi, come ad
esempio un oggetto:

var mario = {nome: "Mario", cognome: "Rossi"};
var gigi = mario;
gigi.nome = "Gigi";
console.log(mario); //{nome: "Gigi", cognome: "Rossi"}
console.log(gigi); //{nome: "Gigi", cognome: "Rossi"}

In questo caso una modifica ad una proprietà dell'oggetto gigi ha
ripercussioni anche sull'oggetto mario. Com'è noto, il motivo
risiede nel fatto che per tipi di dato complessi come array e oggetti,
l'assegnamento ad una variabile consiste in realtà nell'assegnamento del
puntatore della struttura dati. Quello che accade è che più variabili
puntano alla stessa struttura dati e che modifiche apportate ad un suo
elemento siano volontariamente o involontariamente condivise con altre
parti di un'applicazione. In altre parole, il semplice assegnamento di tipi
di dati complessi è predisposto alla generazione di effetti collaterali e
quindi a potenziali bug di difficile identificazione.

Per contrastare la generazione di effetti collaterali nell'assegnamento di
variabili, il modello funzionale propone il concetto di immutabilità, cioè il fatto che un valore non può essere mutato,
modificato. In questo contesto le variabili rappresentano un singolo valore
non modificabile: se qualcosa è stato dichiarato che debba avere un
determinato valore, il resto del codice deve avere la garanzia che
continuerà a mantenere quel valore. Il principio è che se due elementi
rappresentano valori diversi, allora devono essere rappresentati da
variabili diverse.

Uso di costanti

Un primo approccio nel tentare di far rispettare questo principio in JavaScript consiste proprio nel limitare l'uso di variabili e nell'usare al loro posto le costanti. Consideriamo il seguente esempio:

const x = 32;
const y = x;
x = 12;

L'esecuzione dell'ultimo assegnamento genererà un'eccezione, dal momento
che si sta tentando di assegnare un nuovo valore ad una costante. In questo
modo possiamo decidere consciamente se x deve poter variare o si
tratta di un assegnamento accidentale, e quindi causa di potenziali
bug.

Prendere l'abitudine di usare costanti per dichiarare valori può aiutarci
quindi nel prevenire mutazioni indesiderate. Se nell'esempio precedente
volevamo effettivamente assegnare un nuovo valore a x, cambieremo
il codice come mostrato di seguito, ma solo ciò fosse veramente necessario:

let x = 32;
const y = x;
x = 12;

L'utilizzo delle costanti non è però sufficiente, soprattutto quando abbiamo a che fare con strutture complesse. Consideriamo ad esempio il seguente codice:

const mario = {nome: "Mario", cognome: "Rossi"};
const gigi = mario;
gigi.nome = "Gigi";

L'ultimo assegnamento non genererà alcuna eccezione e ci ritroveremo la
proprietà nome dell'oggetto mario con un nuovo valore
nonostante avessimo dichiarato mario e gigi come
costanti. Il fatto è che l'aver dichiarato un oggetto come costante ci
garantisce che il puntatore alla struttura dati che rappresenta l'oggetto
non può cambiare, ma non da alcuna garanzia sulle modifiche alle sue
proprietà ed alla sua struttura. Quindi in questo caso il ricorso a
costanti è una misura troppo debole per garantire l'immutabilità dei
valori.

Freezing degli oggetti

Possiamo ottenere un certo grado di immutabilità per gli oggetti ricorrendo
al metodo Object.freeze(). Il seguente è un esempio d'uso di questo metodo:

const mario = {nome: "Mario", cognome: "Rossi"};
Object.freeze(mario);
mario.nome = "Gigi";

L'ultimo assegnamento non genererà un'eccezione, ma non avrà alcun effetto
sulla proprietà nome dell'oggetto mario. In altre parole
l'oggetto mario è immutabile, quindi sembrerebbe la soluzione
ideale per evitare effetti collaterali. Purtroppo il metodo Object.freeze() blocca le modifiche soltanto per le proprietà
dirette dell'oggetto. Consideriamo infatti il seguente esempio:

const mario = {
nome: "Mario",
cognome: "Rossi",
indirizzo: {
via: "Via Garibaldi",
numero: "11",
citta: "Roma"
}
};
Object.freeze(mario);
mario.indirizzo.numero = "42";

Se ispezioniamo l'oggetto mario dopo l'esecuzione di questo codice,
noteremo con sorpresa che il numero dell'indirizzo è cambiato. Infatti, il
metodo Object.freeze() blocca soltanto le mutazioni al primo
livello delle proprietà di un oggetto, non garantendo quindi una
immutabilità completa.

Potremmo implementare una versione di Object.freeze() che rende
immutabili anche le proprietà di tipo oggetto procedendo ricorsivamente,
come mostrato dal seguente codice:

function deepFreeze(object) {
var propNames = Object.getOwnPropertyNames(object);
for (let name of propNames) {
let value = object[name];
object[name] = value && typeof value === "object" ? deepFreeze(value) : value;
}
return Object.freeze(object);
}

Tuttavia la funzione deepFreeze() corre il rischio di entrare in
un loop infinito se la struttura dell'oggetto ha qualche riferimento
circolare.

In conclusione, JavaScript non supporta nativamente l'immutabilità.
Possiamo ottenere un certo grado di immutabilità sfruttando alcuni semplici
accorgimenti. Se vogliamo andare oltre, possiamo affidarci a librerie
specifiche come ad esempio Immutable.js e mori.

Copie al posto di mutazioni

Naturalmente l'immutabilità dei dati appare come contro-intuitiva nella
programmazione a cui siamo abituiti, dove inevitabilmente abbiamo bisogno
di apportare modifiche. Se dobbiamo preferire l'immutabilità dei dati al
posto delle loro mutazioni, come possiamo elaborarli nelle nostre
applicazioni?

Il principio di fondo è che nel paradigma funzionale un valore rappresenta
lo stato in un particolare istante ed una variabile non è altro che un
alias di quel valore. Nella programmazione imperativa, invece, una
variabile rappresenta un contenitore per lo stato il cui valore cambia nel
tempo.

Pertanto l'alternativa alla mutazione dei dati e la creazione di nuovi dati
al posto della modifica di quelli esistenti, la generazione di un nuovo
stato invece che la modifica dello stato corrente.

Il ragionamento è analogo a quello che avevamo fatto per le funzioni pure:
l'applicazione di una funzione pura non deve modificare i dati di input.
Quindi se abbiamo una funzione che prende in input un oggetto per farci
delle elaborazioni, questa funzione deve restituire un nuovo oggetto, come
nel seguente esempio:

function incrementaEta(persona, numeroAnni) {
return Object.assign({}, persona, {
eta: persona.eta + numeroAnni
});
}

La funzione incrementaEta() dell'esempio prende in input un
oggetto persona ed un numero che rappresenta il numero di anni di
cui incrementare l'età della persona. Come possiamo vedere, la funzione non
lavora direttamente sull'oggetto persona passato come primo
parametro. Viene infatti effettuata una copia tramite Object.assign() sostituendo la proprietà eta con il nuovo
valore. Il risultato finale è un nuovo oggetto persona, distinto
dall'oggetto passato come parametro che infatti rimane immutato.

Oltre che sugli oggetti, possiamo applicare un metodo analogo anche sugli
array sfruttando lo spread operator (...). Consideriamo il
seguente codice:

function addItem(array, item) {
return [...array, item];
}

Quello che ci aspettiamo è che la funzione addItem() restituisca
un array composto dal contenuto dell'array passato come primo parametro
seguito dall'elemento passato come secondo parametro. Come per la funzione incrementaEta(), l'array originale non viene modificato. In questo
modo abbiamo ottenuto una versione pura del metodo push().

Occorre segnalare che sia Object.assign() che lo spread operator non effettuano copie degli oggetti annidati o
degli oggetti contenuti negli array. Quindi sarebbe opportuno conoscere la
struttura degli oggetti da clonare per ottenere una immutabilità effettiva.