Overload delle funzioni in TypeScript

A volte si incontrano funzioni che restituiscono valori, il cui tipo dipende dai parametri passati. Per questo in TypeScript si usa l'overload delle funzioni. Esso permette di specificare diverse varianti delle signature della funzione.

Diamo un'occhiata a un esempio. Supponiamo di avere una funzione che divide i caratteri di una stringa in un array di lettere:

function splitStr(str: string): string[] {
	return str.split('');
}

Supponiamo di avere anche una funzione che divide le cifre di un numero in un array di numeri:

function splitNum(num: number): number[] {
	let str: string = String(num);
	let arr: string[] = str.split('');
	
	return arr.map(elem => +elem);
}

Uniamo entrambe le funzioni in una. La nuova funzione, a seconda del tipo di parametro, deve restituire o un array di numeri o un array di stringhe.

Usiamo l'overload per dichiarare le diverse signature della nostra funzione:

function splitVal(val: number): number[];
function splitVal(val: string): string[] {
	// implementazione di entrambe le signature
}

Scriviamo ora l'implementazione della funzione. Nel suo codice dobbiamo determinare con una condizione quale delle signature della funzione è stata attivata, e in base a questo eseguire il codice necessario con il risultato del tipo corretto:

function splitVal(val: number): number[];
function splitVal(val: string): string[] {
	if (typeof val === 'string') {
		return val.split('');
	} else {
		let str: string = String(val);
		let arr: string[] = str.split('');
		
		return arr.map((elem: string): number => +elem);
	}
}

A differenza di altri linguaggi, in TypeScript nell'overload viene creata una singola funzione. Non è possibile creare più funzioni con lo stesso nome, ma con signature diverse.

Scrivi una funzione che restituirà o modificherà il testo di un elemento DOM. Dovrebbe funzionare nel modo seguente:

text('#elem', 'text'); // imposterà il testo
text('#elem');         // restituirà il testo corrente