DEV Community

Double Slash [FR]

Doit-on utiliser TypeScript ?

Un épisode sur les bases de TypeScript afin de vous convaincre d’utiliser TypeScript dans vos projets Retrouvez la vidéo de l'enregistrement sur le Youtube de DoubleSlash Précision sur les types et interfaces Durant l'épisode, on évoque la différence entre les types et les interfaces. Je dois préciser que l'on peut également faire des objets avec les types. Les principales différences : Les types ne peuvent pas être réimplementés et étendus Les interfaces peuvent être réassignées, ce qui provoque un fusion. Elles peuvent être implémentées contrairement aux types. Nous vous renvoyons sur cette vidéo explicative : https://youtu.be/sFNQeh5Oc08 TypeScript c’est quoi exactement ? En prenant la documentation officielle, TypeScript est un langage de programmation construit par-dessus Javascript et offrant de nouvelles fonctionnalités pour combler les manques. Créé par Anders Hejlsberg (concepteur du FW .net) pour Microsoft entre 2010 et 2012 (premiere version 0.8 en 2012), dans l'objectif de combler les manques de Javascript. JS est obligatoire pour le browser, seulement pour les gros projet, JS c’est pas simple. Le projet est open-source. Ce type de technologie est souvent appelé "Superset", un exemple très connu est SASS pour le CSS. Un language adoré par les dev Java, C++. Nous allons écrire du code TypeScript qui sera ensuite transcompiler en Javascript. Il a été créé en 2012 mais personnellement, j’ai entendu parler de typescript avec la sortie d’angular 2. Avant l’utilisation de typescript, j’utilisais Flow (https://flow.org/) projet FB. Et Babel, si je voulais utiliser des choses non présentes dans JS. Exemple : les classes. Important ! Le code est toujours compilé en JS. Le browser ne sais pas executer du TS. Pareil pour le coté serveur. Deno, convertie en JS. Pourquoi TypeScript ? 1 - Disposer de type : JavaScript est un language au typage dynamique. Dans les langages à typage dynamique, l'interpréteur attribue aux variables un type lors de l'exécution en fonction de la valeur qu'elles possèdent à ce moment. Autre exemple : Piège classique, les valeurs des champs de formulaire sont en texte. Pour provoquer des bugs pour les calcules avec des nombres par exemple. TypeScript te prévient en cas d’usage avec les types définis pour les éléments de formulaire. 2 - Comme les tests, c’est une façon de contrôler et de valider son code 3 - Autocompletion et vérification des valeurs : Quand un projet devient gros avec beaucoup de fonction et de fichier, il devient difficile de se souvenir des paramètres de fonction, les valeurs, etc. En gros, avec TypeScript, c’est une sorte de pair programming. TypeScript vient régulièrement te taper sur l’épaule pour te dire : “Yep mon gars, là, ce que tu fais, ce n’est pas bon.” 4 - Travail avec les API. Cela permet de typer les réponses des API par exemple. On définit clairement la réponse et ensuite on peut être certain que notre code fonctionne correctement. https://medium.com/@wujido20/runtime-types-in-typescript-5f74fc9dc6c4 Principe de base • Initialisation Création du fichier tsconfig.json qui indique comment compiler le code. Avec target, on indique la version de JS. Mini ES5. Max ESNext. https://www.typescriptlang.org/tsconfig#target • Extension des fichiers en .ts ou .tsx • Type/Interface définir les types des variables, paramètres, retour de fonction, etc. • Les types c’est pour les définitions simples • Les interfaces, c’est une sorte de shape d’objet. On pour aller plus loin et faire de l’héritage, etc.. • Inférence TypeScript est capable de définir lui-même le type. À partir du moment où une variable est définie, il peut voir automatiquement le type. • Generic C’est une sorte de typage dynamique. On détermine à l’usage le type de la valeur. Ça offre plus de souplesse, car avec l’inférence, je ne suis pas obligé de typer. Il devine. Si le premier usage de la fonction envoie une string, alors le type est string. Exemple simple : Plus poussé : https://www.digitalocean.com…

Episode source