Tutoriel TypeScript

TypeScript est un sur-ensemble de JavaScript, prenant en charge la norme ECMAScript 6 (Tutoriel ES6)。
TypeScript est un langage de programmation libre et open source développé par Microsoft. C'est un sur-ensemble qui ajoute une vérification statique des types par-dessus JavaScript.
TypeScript est conçu pour développer des applications à grande échelle. Il peut être compilé en JavaScript pur, et le JavaScript compilé peut s'exécuter dans n'importe quel navigateur.
Pourquoi choisir TypeScript
TypeScript est un langage de programmation open source développé par Microsoft. C'est un sur-ensemble de JavaScript.
TypeScript améliore considérablement l'expérience de développement JavaScript en ajoutant des fonctionnalités telles que les types statiques optionnels, les interfaces et les énumérations.
Principaux avantages de TypeScript
- Vérification statique des types :Détecter les erreurs de type au moment de la compilation, ce qui réduit les erreurs d'exécution
- Prise en charge IDE puissante :Complétion de code intelligente, navigation et refactorisation
- Meilleure lisibilité du code :Les types eux-mêmes sont la meilleure documentation
- Fonctionnalités JavaScript modernes :Prend en charge la syntaxe ES6+, comme les fonctions fléchées, les modules, les classes, etc.
- Migration progressive :Permet de migrer progressivement les projets JavaScript existants vers TypeScript
Fonctionnement de TypeScript
TypeScript ne peut pas s'exécuter directement dans le navigateur ; il doit d'abord être compilé en JavaScript. Ce processus de compilation vérifie les erreurs de type et convertit la syntaxe propre à TypeScript en JavaScript pur.
Diagramme SVG : processus de compilation TypeScriptLe compilateur TypeScript (tsc) effectue une vérification de type pendant le processus de compilation. Si des erreurs de type sont détectées, il signale une erreur et arrête la compilation. Après une compilation réussie, il génère du code JavaScript pur qui peut s'exécuter dans n'importe quel navigateur ou environnement Node.js.
Fonctionnalités du langage
TypeScript est une extension de JavaScript enrichie de types. Tout en conservant la compatibilité avec la syntaxe d'origine, il introduit un système de types plus fort et des capacités d'ingénierie.
Capacités d'amélioration essentielles (spécifiques à TypeScript)
| Fonctionnalité | Description |
|---|---|
| Annotations de type et vérification à la compilation | Détecter les erreurs de type pendant le développement, ce qui améliore la fiabilité du code |
| Inférence de type | Pas besoin de déclarer explicitement les types ; le compilateur peut les inférer automatiquement |
| Effacement des types | Supprimer les informations de type après compilation, en produisant du JavaScript pur |
| Interface | Utilisé pour définir des structures d'objet, ce qui renforce les contraintes du code |
| Énumération | Fournit un ensemble de constantes nommées, améliorant la lisibilité |
| Génériques | Prend en charge la réutilisation des types, améliorant la flexibilité des fonctions et des classes |
| Mixin | Implémente un modèle de composition pour l'héritage multiple |
| Espace de noms | Organise la structure du code (ancienne approche, les modules sont désormais plus couramment utilisés) |
| Tuple | Tableaux de longueur fixe avec différents types |
| Asynchrone (Await) | Fournit un contrôle de flux asynchrone plus intuitif |
Prise en charge de la syntaxe à partir d'ES2015 (rétrocompatible)
TypeScript prend également en charge et compile les fonctionnalités principales d'ECMAScript 2015 :
| Fonctionnalité | Description |
|---|---|
| Classe | Prise en charge de la programmation orientée objet |
| Module | Prend en charge le développement modulaire (import/export) |
| Fonctions fléchées (=>) | Syntaxe de fonction plus concise, liaison de portée lexicale |
| Paramètres facultatifs | Les paramètres de fonction peuvent être omis |
| Paramètres par défaut | Fournit des valeurs par défaut pour les paramètres |
Différences entre JavaScript et TypeScript
TypeScript est un sur-ensemble de JavaScript. Il étend la syntaxe de JavaScript, de sorte que le code JavaScript existant peut fonctionner avec TypeScript sans aucune modification. TypeScript fournit une vérification statique des types à la compilation via des annotations de type.
TypeScript peut gérer le code JavaScript existant et ne compile que le code TypeScript qu'il contient.
Premier exemple TypeScript
Dans l'exemple suivant, nous utilisons TypeScript pour afficher Hello World!:
Autres extensions