TypeScript

Le langage TypeScript

Le langage TypeScript est un surensemble de JavaScript qui apporte des fonctionnalités supplémentaires à JavaScript. Il s’agit d’un langage de programmation open source développé par Microsoft pour améliorer la productivité des développeurs en ajoutant des fonctionnalités de typage statique à JavaScript. TypeScript est souvent décrit comme un langage de « JavaScript amélioré », car il permet de détecter les erreurs de typage avant l’exécution du code JavaScript, ce qui contribue à réduire les bogues et facilite la maintenance du code. TypeScript propose également des fonctionnalités avancées telles que l’héritage de classes, les interfaces, les modules et la vérification statique des types, ce qui en fait un choix populaire pour les projets de grande envergure et les équipes de développement collaboratives. Une fois le code TypeScript écrit, il est ensuite transpilé en JavaScript pour être exécuté sur n’importe quel navigateur ou environnement JavaScript. TypeScript est largement utilisé dans le développement d’applications Angular, car il fournit une meilleure prise en charge des outils de développement, des fonctionnalités de refactoring et une meilleure...

Les différences avec JavaScript

TypeScript inclut toutes les fonctionnalités de JavaScript et ajoute des fonctionnalités supplémentaires. Les principales différences entre TypeScript et JavaScript résident dans l’ajout de fonctionnalités de typage statique et dans la prise en charge des fonctionnalités avancées de programmation orientée objet.

TypeScript :

let name: string = "John"; 
let age: number = 25; 
let isStudent: boolean = true; 

JavaScript :

let name = "John"; 
let age = 25; 
let isStudent = true; 

Dans l’exemple TypeScript, les types des variables sont explicitement déclarés (string, number, boolean), ce qui permet à TypeScript de détecter les erreurs de typage lors de la compilation.

Le transpiler et son utilité

Dans le développement moderne de sites web, le transpiler joue un rôle important dans la transformation de code source en code exécutable. Dans le contexte d’Angular et de Node.js, le transpiler est un outil qui permet de convertir le code écrit dans une version récente de JavaScript (ES6/ES2015) en une version compatible avec les navigateurs et les plateformes qui ne supportent pas encore cette version. Parmi les avantages de la transpilation, citons la possibilité d’utiliser des fonctionnalités plus modernes et avancées de JavaScript qui ne sont pas disponibles dans les anciennes versions (les fonctions fléchées, les classes et l’opérateur de propagation, etc.), ainsi que la détection d’erreurs avant l’exécution du code. Il existe plusieurs outils de transpilation disponibles pour le développement web, tels que Babel, TypeScript et Traceur. Ces outils prennent en charge différents aspects de la conversion de code, tels que la syntaxe, la sémantique et les API.

La transpilation ne dispense pas complètement de l’apprentissage des anciennes versions de JavaScript  ; il est toujours important de comprendre les concepts et les principes fondamentaux du langage. Elle est simplement un outil supplémentaire pour vous aider à écrire un code plus...

Les types

Les fonctions

Les classes

class Person { 
  constructor(name, age) { 
    this.name = name; 
    this.age = age; 
  } 
 
  sayHello() { 
    console.log(`Hello, my name is ${this.name} 
and I am ${this.age} years old.`); 
  } 
} 

Les interfaces

interface Person { 
  name: string; 
  age: number; 
  introduce(): void; 
} 

Les décorateurs

Les décorateurs sont une fonctionnalité avancée qui permet d’ajouter des métadonnées et de modifier le comportement des classes, des méthodes, des propriétés et d’autres éléments du code. Les décorateurs fournissent un moyen de décorer ou d’annoter des éléments du code avec des fonctionnalités supplémentaires, sans avoir à les modifier directement. Les décorateurs sont définis à l’aide de la syntaxe @nomDuDecorateur qui est placée juste avant la déclaration de l’élément à décorer. Ils peuvent être utilisés pour ajouter des fonctionnalités telles que la journalisation, la validation, la gestion des autorisations, la transformation des données, etc.

Un décorateur est lui-même une fonction qui est appelée avec différentes informations sur l’élément décoré. Il peut prendre des arguments et retourner une nouvelle version de l’élément décoré, en y ajoutant des comportements supplémentaires.

Voici un exemple simple d’utilisation d’un décorateur pour ajouter une fonctionnalité de journalisation à une méthode de classe en TypeScript :

function logConstructor(constructor:...

Conclusion

Au cours de ce chapitre, nous avons plongé dans la diversité des types, qu’il s’agisse des types fondamentaux ou des types spéciaux tels que enum ou any. Une compréhension solide de ces types est essentielle pour une utilisation efficace de TypeScript, car elle permet de définir rigoureusement la nature des données manipulées, ce qui contribue à la fiabilité du code. Nous avons également mis en lumière les différences substantielles entre JavaScript et TypeScript, et ce faisant, nous avons mis en évidence les raisons qui poussent les développeurs à adopter ce dernier. Cette comparaison a permis de saisir la valeur ajoutée que TypeScript apporte au développement web moderne.

Les fonctions ont été au cœur de notre exploration, en particulier les fonctions anonymes et les fonctions constructeurs. Ces éléments fondamentaux sont les briques de base de la programmation en TypeScript, ils permettent de créer des routines réutilisables et d’initialiser des objets de manière structurée.

Nous avons ensuite vu comment créer des classes, instancier des objets, gérer l’héritage, et nous avons étudié la surcharge de méthodes. Les classes sont la pierre angulaire de la programmation orientée objet en TypeScript, elles...