La risposta di Microsoft è stata TypeScript che ha anche utilizzato il linguaggio in casa propria per progetti come Monaco, la versione web-based di Visual Studio.
Il compilatore di TypeScript è implementato in linguaggio TypeScript ed è su CodePlex.
TypeScript è un superset di JavaScript, per la precisione un superset della sintassi ECMAScript 5 (ES5), cioè un linguaggio che estende JavaScript ma che produce in output codice JavasScript a seguito della compilazione. Essendo un superset, ogni programma JavaScript è anche un programma TypeScript. Inoltre la sintassi TypeScript include diverse caratteristiche proposte dell'ECMAScript 6 (ES6) che comprendono classi e moduli. Estendendo Javascript con tipi, classi, interfacce e moduli, si agevola lo sviluppo di applicazioni facilmente scalabili e si permette una maggiore produttività con i tool di sviluppo (refactoring, debugging, intellisense, tipi verificati staticamente ecc.). In sostanza tramite la type-safety ed una programmazione object-oriented si tutela lo sviluppo senza perdere i vantaggi di javascript, cross-platform in primis.
TypeScript 1.0 è disponibile con l'update 2 di Visual Studio 2013 , come plug-in Visual Studio 2012 o anche come package di Node.js ( npm install -g typescript) ma è disponibile anche in altri IDE/Editor (Eclipse, JetBrains IDE, Sublime Text, Emacs, Vim ecc.).
Sul sito typescriptlang.org potete trovare tutte le risorse (tutorial, help, playground ecc.) riguardo a TypeScript.
In Javascript si utilizzano molte librerie di terze parti (dojo, jquery ecc.) e per poterle utilizzare con TypeScript occorre innanzitutto dichiarare la libreria che si vuole utilizzare tramite il classico tag script. Per quel che riguarda lo sviluppo essa ha esclusivamente l'obiettivo di consentirci il normale funzionamento ma, dal punto di vista delle definizioni, non ha alcun effetto pratico.
Per permettere al compilatore TypeScript di conoscere le definizioni, occorre innanzitutto procurarsi il file di definizione "libreria.d.ts" reperibile ad esempio su github. Esiste una collezione di definizioni molto estesa e aggiornata che è possibile trovare a questo indirizzo: https://github.com/borisyankov/DefinitelyTyped o tramite nuget da console Get-Package -Filter DefinitelyTyped -ListAvailable. Il file di definizione permette di avere a disposizione l'intellisense ma soprattutto di conoscere i tipi validando il codice.
Il file di definizione per ArcGIS API for JavaScript lo trovate nel repository Esri su github all'indirizzo: https://github.com/Esri/jsapi-resources/tree/master/typescript
Infine vediamo un semplicissimo esempio con ArcGIS API for JavaScript.
Creiamo un nuovo progetto in Visual Studio 2013 utilizzando il template TypeScript:
Importiamo il file di definizione esri.d.ts nella soluzione:
Ora ci creiamo nel progetto un nuovo file TypeScript Point.ts (i file hanno estensione ts) e, ad esempio, estendiamo la classe Point di Esri. Le classi TypeScript supportano anche l'ereditarietà.
Referenziamo il file di definizione esri.d.ts mediante una sintassi basata su un commento:
/// <reference path="../esri.d.ts" />
Ora aggiungiamo un metodo alla classe Point. Importiamo il modulo esterno di interesse assegnandoci un alias (AGSPoint) ed estendiamo la nostra classe (Point) con la parola chiave extends aggiungendo il metodo log() ed infine indichiamo che la classe potrà essere visibile all'esterno con export (può anche essere utilizzato anche per proprietà, metodi, tipi statici e anche semplici variabili)
e questo è il relativo js prodotto (Point.js):
Ora aggiungiamo un altro file TypeScript (app.ts) dove utilizziamo, a titolo di esempio, la classe Point del modulo esterno Point.ts nel metodo di ingresso della pagine html per testarne il funzionamento:
Come possiamo notare quando scriviamo il codice ci viene in aiuto l'intellisense:
e questa è la nostra pagina html che richiama la funzione in app.ts
Eseguiamo e verifichiamo dalla console del browser il risultato:
e possiamo, come detto, andare in debug:
Post
Nessun commento:
Posta un commento