Angular - 3.11 Affichage des détails de la recette

Dans la précédente vidéo nous avons manipulé des fichiers avec une extension .ts : ce sont des fichiers TypeScript. Il est important de présenter cette technologie car elle joue un rôle central dans Angular. Le framework a été conçu pour fonctionner avec TypeScript, comme on a déjà pu le constater. Angular est très structuré et met fortement l'accent sur la robustesse : c'est pour cela que le CLI génère lui-même tous les dossiers, sous-dossiers et fichiers — cela évite des tâches laborieuses mais aussi des erreurs humaines, et garantit qu'un fichier généré fonctionne à coup sûr.

Il faut préciser que TypeScript ne fait pas partie intégrante d'Angular : c'est une technologie open source créée par Microsoft, utilisable en dehors d'Angular. D'autres bibliothèques SPA permettent aussi d'utiliser TypeScript, mais cela reste un choix du développeur. Le fait qu'Angular l'utilise par défaut témoigne d'une convergence de philosophie en matière de robustesse. Tout ce qui est faisable en JavaScript l'est aussi en TypeScript : c'est simplement une surcouche qui apporte son lot de nouveautés.

Typage explicite et interfaces

La fonctionnalité la plus importante est le typage — d'où le nom. Les langages de script comme PHP, Python, Ruby ou JavaScript ont un typage implicite : le développeur ne précise pas le type d'une variable, qui est défini dynamiquement à l'exécution. À l'inverse, Java, Kotlin ou C imposent un typage explicite lors de la déclaration. En JavaScript, on peut sans erreur affecter une string puis un integer à la même variable, ce qui ouvre la porte à des bugs et complique la lecture. TypeScript permet de figer ce type :

  • déclarer let nom: string = "Naziff"; impose que la variable reste une string ;
  • lui affecter ensuite un integer souligne immédiatement la variable en rouge dans l'éditeur ;
  • si on compile malgré tout, le compilateur TypeScript renvoie une vraie erreur de compilation.

TypeScript ajoute également les interfaces aux classes. Même si ECMAScript 6 a rapproché la syntaxe des classes JavaScript de celle de Java — plus lisibles et mieux architecturées — JavaScript ne propose toujours pas d'interface. TypeScript comble ce manque pour permettre un code plus pur et plus facile à structurer. Comme dit précédemment, le navigateur ne comprend pas TypeScript directement : le CLI Angular le compile en JavaScript classique. Bonne nouvelle pour terminer : vous n'avez pas besoin d'être spécialiste en TypeScript pour suivre la formation — à partir du moment où vous êtes à l'aise avec JavaScript, vous assimilerez les concepts au fil de l'eau.