Una semplice introduzione a Typescript

Una breve introduzione ad alcuni concetti di Typescript

compilatore TypeScript

Il compilatore TypeScript è un programma JavaScript che converte il codice TypeScript in codice JavaScript semplice. È scritto in TypeScript e può essere eseguito su qualsiasi piattaforma che supporti JavaScript. Il compilatore TypeScript è open source e disponibile su GitHub. Il compilatore è sviluppato e gestito da Microsoft e può essere utilizzato dalla riga di comando oppure può essere utilizzato come plug-in per IDE popolari come Visual Studio e WebStorm.

Il compilatore TypeScript può emettere codice JavaScript compatibile con diversi runtime JavaScript, come Node.js, Internet Explorer e Chrome. Può anche generare mappe di origine, che associano il codice JavaScript generato al codice TypeScript. Ciò consente il debug del codice TypeScript nel browser.

Il compilatore può essere configurato per verificare la presenza di errori di tipo e segnalerà gli errori se ne vengono trovati. Il controllo del tipo può essere disabilitato se lo si desidera. Il compilatore TypeScript è disponibile con la licenza open source Apache 2.0.

Non è un linguaggio fortemente tipizzato

Typescript non è un linguaggio fortemente tipizzato perché non richiede la dichiarazione di variabili con un tipo specifico. Ciò significa che una variabile può essere dichiarata come un tipo e quindi riassegnata a un valore di un altro tipo. Ciò può causare errori se la variabile viene utilizzata in un modo non compatibile con il tipo per cui è stata dichiarata.

Un esempio di base per illustrare questa caratteristica può essere mostrato con il tipo "any".

// We initialze the variable as a string.
const something: any = "Tom";

// Now it's a number. This is valid TypeScript code.
something = 42;

Compilazione di TypeScript in JavaScript

Il compilatore TypeScript prende il codice TypeScript e lo converte in codice JavaScript semplice. Questo processo è noto come traspirazione. Il compilatore prima analizza il codice TypeScript, che verifica la presenza di errori di sintassi. Se non vengono trovati errori, il compilatore verifica la presenza di errori di tipo. Se vengono rilevati errori di tipo, il compilatore li segnalerà ed esce.

Se non vengono trovati errori di tipo, il compilatore continuerà ed emetterà il codice JavaScript. Il codice JavaScript emesso sarà compatibile con il runtime JavaScript di destinazione specificato.

Il compilatore TypeScript può anche generare mappe di origine, che associano il codice JavaScript generato al codice TypeScript. Ciò consente il debug del codice TypeScript nel browser.

Server del linguaggio TypeScript

Il server del linguaggio TypeScript è un server del linguaggio che fornisce funzionalità come il completamento del codice, il passaggio alla definizione e il controllo del tipo per i progetti TypeScript.

Il server del linguaggio è necessario affinché il compilatore TypeScript sia in grado di fornire queste funzionalità. Senza il server del linguaggio, il compilatore TypeScript sarebbe in grado di fornire solo funzionalità di base come l'evidenziazione della sintassi e la formattazione del codice. Il server del linguaggio TypeScript è open source e disponibile su GitHub.

Passaggi per creare un progetto TypeScript

Prima di descrivere i passaggi, ecco il comando per inizializzare un progetto TypeScript nel tuo terminale.

npx tsc --init

Descrizione: Installa il compilatore TypeScript. Crea un file tsconfig.json nella radice del progetto. Questo file contiene le opzioni del compilatore per il compilatore TypeScript. Aggiungi la directory src al file tsconfig.json. Qui è dove si troveranno i file di origine TypeScript.

Aggiungi un file main.ts nella directory src. Questo è il punto di ingresso per il programma TypeScript. Compila il codice TypeScript eseguendo tsc dalla riga di comando. Questo genererà i file JavaScript nella directory src. Esegui il programma TypeScript eseguendo node main.js dalla riga di comando.

Differenze tra TypeScript e JavaScript

Esistono alcune differenze chiave tra TypeScript e altri linguaggi fortemente tipizzati: TypeScript è un superset di JavaScript, il che significa che qualsiasi codice JavaScript valido è anche codice TypeScript valido. Ciò semplifica l'adozione per i progetti JavaScript esistenti.

TypeScript utilizza un sistema di tipi opzionale, il che significa che i tipi possono essere specificati per le variabili, ma non è necessario. Altri linguaggi fortemente tipizzati, come Swift e Kotlin, utilizzano un sistema di tipi obbligatorio, che richiede che tutte le variabili siano dichiarate con un tipo specifico.

TypeScript supporta i generics, che consentono raccolte type-safe e altre strutture di dati. Questo non è disponibile in JavaScript.

Quando dovrei usare Javascript invece di Typescript per la codifica?

Non esiste una regola rigida su quando utilizzare JavaScript o TypeScript. Spetta allo sviluppatore scegliere lo strumento giusto per il lavoro. Tuttavia, ci sono alcune linee guida generali che possono essere seguite.

Se un progetto è già scritto in JavaScript, di solito è meglio continuare a utilizzare JavaScript. Non è necessario convertire il codice in TypeScript solo per il gusto di utilizzare TypeScript. Ma tieni presente che la manutenzione di un progetto JavaScript può essere più difficile a causa della mancanza di un sistema di tipi che porta a bug nascosti. Pertanto è meglio considerare l'adozione di TypeScript se il progetto verrà mantenuto (ed esteso) in futuro.

Se un progetto parte da zero, di solito è meglio usare TypeScript. Ciò consentirà una migliore organizzazione e manutenzione del codice a lungo termine.

Esempi semplici

// TypeScript.
class Person {
  name: string;
  age: number;
}

const person: Person = new Person();
const person.name = "Tom";
const person.age = 42;

// JavaScript.
var Person = function() {};
Person.prototype.name = "";
Person.prototype.age = 0;

// TypeScript.
// Here's we're also using the class, but this
// time conforming to an interface, something that
// doesn't exist in JavaScript.
interface IPerson {
  name: string;
  age: number;
}

class Person implements IPerson {
  name: string;
  age: number;
}

// JavaScript.
var IPerson = function() {};
IPerson.prototype.name = "";
IPerson.prototype.age = 0;

var Person = function() {};
Person.prototype = Object.create(IPerson);

Parole di chiusura

TypeScript è un linguaggio potente che può aiutare a migliorare la qualità del tuo codice. È facile iniziare e può essere utilizzato su qualsiasi piattaforma che supporti JavaScript. Questo articolo ha fornito solo una breve introduzione, poiché la lingua offre molte più funzionalità e concetti da imparare ora.

Controlla i link nell'addendum alla fine della pagina per alcuni utili materiali didattici.