TypeScript

	TypeScript
Date de première version	9 février 2012
Paradigme	Multi-paradigme
Auteur	Anders Hejlsberg...
Développeur	Microsoft
Dernière version	5.8.2 (28 février 2025)
Version en développement	4.6 RC (11 février 2022)
Typage	dynamique, faible, fort optionnel, statique optionnel
Influencé par	JavaScript, C#, F#
Écrit en	JavaScript et TypeScript
Licence	Open Web Foundation, compilateur : Apache 2.0
Site web	http://www.typescriptlang.org/
Extension de fichier	.ts
	modifier

TypeScript est un langage de programmation libre et open source développé par Microsoft qui a pour but d'améliorer et de sécuriser la production de code JavaScript. C'est un sur-ensemble de JavaScript (c'est-à-dire que tout code JavaScript correct peut être utilisé avec TypeScript). Le code TypeScript est transcompilé en JavaScript, et peut ainsi être interprété par n'importe quel navigateur web ou moteur JavaScript. TypeScript a été cocréé par Anders Hejlsberg, principal inventeur de C# ^[3]^,^[4]^,^[5]^,^[6]^,^[7].

TypeScript permet un typage statique optionnel des variables et des fonctions, la création de classes et d'interfaces, l'import de modules, tout en conservant l'approche non-contraignante de JavaScript. Il supporte la spécification ECMAScript 6.

Historique

Cette section est vide, insuffisamment détaillée ou incomplète. Votre aide est la bienvenue ! Comment faire ?

TypeScript a été rendu public en octobre 2012 (à la version 0.8), après deux ans de développement interne chez Microsoft^[8]^,^[9]. Peu de temps après l'annonce, Miguel de Icaza a salué le langage lui-même, mais a critiqué le manque d'environnement de développement mature en dehors de Microsoft Visual Studio, qui n’était pas disponible sur Linux et OS X^[10]^,^[11].

L'environnement de développement Visual Studio Code, porté par le framework Electron (à l'initiative de Google Chromium), disponible sous Windows, MacOSX et Linux, permet désormais de combler ce vide.

Fonctionnalités

Le langage ajoute les fonctionnalités suivantes à ECMAScript 6 :

Typage statique
Typage générique
Interfaces
Classe, classe abstraite, expressions de classe
Modules
Mixin
Enumérations
Paramètres optionnels
Unions
Alias, alias de type générique
Instruction
Symboles
Propriétés calculées
Mots clés let, const et for … of

Depuis la version 1.6, la syntaxe JSX est supportée.

Typage statique

Le langage permet de préciser le contenu d'une variable ou la valeur de retour d'une fonction (ou d'une méthode) :

// Création d'une variable contenant une valeur booléenne.
var maValeurBooleenne: boolean = false;

// Création d'une variable contenant une chaîne de caractère.
var maChaineDeCaractere: string = "Hello World";

// Création d'une variable contenant un nombre.
var monNombre: number = 1;

// Création d'une fonction retournant une chaîne de caractère.
function maFonction(): string {
    return "Ma valeur de retour";
}

Type générique

Il est également possible de créer des types génériques. Pour une méthode :

function maFonction<T>(parametre: T) {
    // Contenu de la fonction.
}

Pour une classe :

class MaClasse<T> {
    maVariable : T;
    // Contenu de la classe.
}

// Création d'une instance de la classe "MaClasse" en définissant un type.
var monInstance = new MaClasse<string>();
monInstance.maVariable = "Hello World";

Interfaces

Exemple

Les interfaces sont un concept essentiel et permettent d'avoir cette notion de typage. En créant une interface, il devient alors possible de l'utiliser pour préciser le contenu d'une variable ou d'une classe :

interface MonInterface {
    // Création d'une signature de variable.
    maVariable: string;
    // Création d'une signature de méthode.
    maMethode(parametre: string): void;
}

class MaClasse implements MonInterface {
    maVariable: string;
    maMethode(parametre: string): void {
        // Contenu de la méthode.
    }
}

// Précision du type de la variable en utilisant l'interface.
var instance: MonInterface = new MaClasse();

DefinitelyTyped

Une large bibliothèque d'interface, destinée à des classes (ou fonctions) qui ont été développés en JavaScript, est disponible sur un dépôt GitHub par borisyankov.

Classes

Le langage apporte le support des classes. L'héritage y est également pris en charge :

class MaClasseDeBase {
    private _firstname;
    private _lastname;

    public constructor(firstname: string, lastname: string) {
        this._firstname = firstname;
        this._lastname = lastname;
    }

    public direBonjour(): string {
        return "Bonjour " + this._firstname + ", " + this._lastname;
    }
}

// La classe hérite de "MaClasseDeBase".
class MaClasse extends MaClasseDeBase {
    public constructor(firstname: string, lastname: string) {
        // Accède au constructeur de "MaClasseDeBase".
        super(firstname, lastname);
    }
}

// Création d'une instance de "MaClasse" et 
// appel de la méthode: "direBonjour" de la classe parente : "MaClasseDeBase".
var monInstance: MaClasse = new MaClasse("Jean", "Dupond");
monInstance.direBonjour();

Comme il est montré dans l'exemple ci-dessus, le langage autorise les trois types de visibilités, à c'est-à-dire : public, private et protected. Ce dernier est arrivé avec la version 1.3^[12].

Modules

La création de module (que l'on peut qualifier d'espace de nommage) est permise en utilisant le mot-clé module :

module mon.espace.de.nom {
    // Contenu du module: classe, fonction, etc.
}

TypeScript distingue les modules internes des modules externes. Les modules internes sont basées sur la syntaxe de ECMAScript 6, tandis que les modules externes exploitent une bibliothèque externe : AMD ou CommonJS^[13].

Énumérations

L'utilisation d'énumération dans du code TypeScript est offerte à travers le mot-clé enum.

Sans la définition de valeur à une constante :

enum Couleur {Bleu, Rouge, Vert};

Il est à noter que, par défaut, la première constante de l'énumération aura pour valeur, 0.

Avec la définition de valeur :

enum Couleur {Bleu = 0, Rouge = 1, Vert = 2};

Il est tout à fait possible de donner la valeur "1" (ou tout autre nombre) à la première constante.

Paramètres optionnels

Un paramètre peut être défini comme optionnel en TypeScript, en ajoutant le caractère ? après le nom de la variable :

function maFonction(monParametre?: string) {
    // On teste si le paramètre "monParametre" a une valeur.
    if (monParametre) {
        return monParametre;
    } else {
        // Dans le cas contraire, une valeur par défaut est retournée.
        return "Hello World";
    }
}

// La valeur retournée sera : "Hello World" sans avoir un message d'avertissement lors de la compilation.
var resultat: string = maFonction();
// La valeur retournée sera : "Ma valeur".
var resultat: string = maFonction("Ma valeur");

Unions

Les unions sont arrivées avec la version 1.4 du langage^[14]. Cette fonctionnalité autorise l'ajout de multiples types pour le paramètre d'une fonction (ou d'une méthode) :

// La fonction autorise que le paramètre soit une chaîne de caractère ou un tableau de chaîne de caractère.
function maFonction(monParametre: string|string[]): void {
    if (typeof monParametre === "string") {
        // Traitement de ma chaîne de caractère.
    } else {
        // Traitement de mon tableau.
    }
}

Alias

En plus des unions, la version 1.4 apporte la possibilité de créer des alias :

// Création d'un alias basé sur le type "number".
type MonAlias = number;
// Utilisation de l'alias ci-dessus.
var monNombre: MonAlias = 1;

Outils de développement

Compilateur

Pour effectuer la transformation de code TypeScript en code JavaScript, un compilateur est nécessaire. Pour cela, il faut utiliser le compilateur, nommé tsc. Il peut être installé depuis le gestionnaire de package npm. La version actuelle supporte, par défaut, la spécification ECMAScript 3. Il supporte également des fonctionnalités exclusives de la spécification ECMAScript 5 et 6 (en spécifiant dans les options du compilateur)^[15].

Environnements de développement

Le compilateur peut être associé à divers environnements tel que :

Microsoft Visual Studio 2013 Update 2
Visual Studio Code^[16]
WebStorm^[17]
Eclipse
Sublime Text
Emacs^[18]
Codeanywhere^[19]
IntelliJ IDEA^[20]
Atom, au moyen d'un plugin apportant l'autocomplétion, la navigation, la mise en forme et la compilation
AppleScript (Depuis MacOS Leopard)

Voir aussi

Liens externes

(en) Site officiel
TypeScript sur GitHub

Références

[wikidata-d035b27b05c2696cd7c134b64b7d6b32e3605d42-1] {a et b} « Release v5.8.2 »

[wikidata-c353a58a0323f7f5d6cc8a6518192e2149e80468-2] « https://github.com/microsoft/TypeScript/releases/tag/v4.6-rc »

[3] Microsoft takes the wraps off TypeScript, a superset of JavaScript | ZDNet

[4] TypeScript: JavaScript Development at Application Scale - Somasegar's blog - Site Home - MSDN Blogs

[5] Microsoft TypeScript: Can the father of C# save us from the tyranny of JavaScript? | ZDNet

[6] Microsoft Augments Javascript for Large-scale Development CIO.com

[7] ttp://www.siteduzero.com/news-62-45586-p1-microsoft-devoile-le-typescript-evolution-de-javascript.html

[8] (en)Microsoft augments JavaScript for large-scale development

[9] (en)Announcing TypeScript 1.0

[10] (en)TypeScript: First Impressions

[11] (en)Microsoft TypeScript: Can the father of C# save us from the tyranny of JavaScript?

[12] Announcing TypeScript 1.3

[13] An introduction to TypeScript’s module system

[14] Announcing TypeScript 1.4

[15] Compiler Options

[16] Using TypeScript in Visual Studio Code - MSDN Blogs

[17] TypeScript Support in WebStorm

[18] Sublime Text, Vi, Emacs: TypeScript enabled!

[19] Supported Syntax Highlighting and Themes : Support - Codeanywhere

[20] « IntelliJ IDEA 2016.2 Help :: TypeScript Support », sur www.jetbrains.com (consulté le 13 septembre 2016)

[1]

[2]

[3]

[4]

[5]

[6]

[7]

[8]

[9]

[10]

[11]

[12]

[13]

[14]

[15]

[16]

[17]

[18]

[19]

[20]

v · m JavaScript
Analyse statique de programmes	ESLint JSHint JSLint
Compilateur source à source	Babel.js CoffeeScript Dart Emscripten Google Closure Compiler Google Web Toolkit Morfik TypeScript AtScript Opa Nim Haxe Clojure WebSharper
Concepts	Ajax Client-side HTML dynamique Framework JavaScript Syntaxe JavaScript Javascript discret
Débogueur	Firebug Komodo IDE Microsoft Script Debugger Microsoft Script Editor Opera Dragonfly Venkman Web Inspector
Générateur de documentation	JSDoc
Éditeurs (comparaison (en))	Ace Cloud9 IDE Atom CodeMirror Light Table Brackets Koding Orion PhpStorm Visual Studio Visual Studio Express Visual Studio Code Visual Studio Team Services
Moteur	Moteur JavaScript
Framework	Comparaison des frameworks JavaScript
Technologie associée	Feuilles de style en cascade Document Object Model HTML JSON WebAssembly
Gestionnaire de paquets	npm NuGet Yarn
Côté serveur	Active Server Pages Bun CommonJS JSGI Node.js Deno Wakanda
Test unitaire	Jasmine Mocha QUnit
Personnalité	Douglas Crockford Brendan Eich John Resig