71 TS – Typed Functions

Pubblicato il di

Facciamo un breve riepilogo sulle funzioni di JavaScript.

Esempio di funzione classica con il costrutto function che può restituire un valore o un undefined

function myFunction() {

}

oppure possiamo assegnare una funzione in una variabile

let myFunc = function() {

}
myFunc();

Con myFunc() richiamo la funzione.

Altro tipo sono le arrow function

let myArrowFunc = (e) => { console.log(e) }

Passando a TypeScript, possiamo definire il tipo di parametro

let myArrowFunc = (e : any) => { console.log(e) }
myArrowFunc('test');

Con un solo parametro posso evitare le graffe, ecco un esempio con il tipo number che raddoppia il valore

let myArrowFunc = (e : number) => e*2
console.log(myArrowFunc(3));

come visto abbiamo indicato che è di tipo number, se passassimo una stringa riceveremmo un errore.

Oltre a verificare i membri di una funzione, TypeScript ci permette di assegnare il tipo di dato anche al ritorno.

let myArrowFunc = (e : number) : number => e*2
console.log(myArrowFunc(3));

in questo caso, oltre che il parametro passato, anche il risultato restituito deve essere un numero.

Questa opzione non sarebbe accettata

let myArrowFunc = (e : number) : number => e*2+'ciao'
console.log(myArrowFunc(3));

Riassumendo, possiamo creare una funzione col classico function e specificare i tipi di parametri anche diversi tra loro e poi specificare il tipo di ritorno che vogliamo, cioè di qualunque tipo

function func(x: string, y: number) : void {

}

per esempio posso anche assegnare ad una variabile una funzione con dei tipi di parametri che ritorna vuota

let myVar : (x: string, y: number) : void;

Non è necessario rispettare il nome dei parametri, ma il tipo, infatti è ammesso dire che

myVar = func;

i tipi di dato sono rispettati, diversamente se in func avessi 2 parametri number

function func(x: number, y: number) : void {

}

verrebbe generato un errore all’uguaglianza tra myVar e func

function func(x: string, y: number) : void {
  console.log('I am func')
}

let myVar : (x: string, y: number) : void;

myVar = func;
func('test', 4);

eseguendo non ottengo nessun errore, ma otterrò in output I am func. Come detto posso cambiare i nomi dei parametri rispettando il tipo

let myVar = function(name: string, age: number) : void {
  console.log(name + 'is' + age + 'years old');
}

Nessun errore nonostante i diversi nomi dei parametri ( name != x).

Questo tipizzazione non è possibile in JavaScript possiamo tipificare le funzione sia che utilizziamo una arrow function, sia che utilizziamo la forma classica con function, specificare il tipo di parametro fra tutti quelli che abbiamo visto e ogni funzione potrà ritornare qualsiasi tipo di valore noi dichiariamo. Oppure posso creare una variabile che riceva una funzione con specifici tipi di dati che scelgo a priori. Posso assegnare al volo un’altra funzione purché rispetti il tipo di dati, non i nomi.