Transcript for:
Introduction et caractéristiques de TypeScript

Tout ce qu'il faut savoir sur TypeScript en 5 minutes et en français, c'est ce que je te propose dans cette vidéo. TypeScript a été créé en 2010 par Microsoft. De base, uniquement en interne. Puis en 2012, ils ont Open Source TypeScript pour que tout le monde puisse en profiter. TypeScript, il faut bien comprendre que c'est juste une sorte de superset de JavaScript. C'est-à-dire que TypeScript, ça reste du JavaScript, mais ça vient rajouter des nouvelles choses. Le gros problème avec JavaScript, c'est que le navigateur, Chrome, etc., parle uniquement JavaScript. C'est-à-dire que Chrome ne comprend que JavaScript. Et c'est pour cette raison que, quand toi... sur ton ordinateur, sur ton VS Code, tu viens écrire du TypeScript, et bien celui-ci doit passer par une étape de transpilation, en transpilant TypeScript en JavaScript, afin que ton navigateur comprenne ce que tu es en train de faire. Ce qu'il faut comprendre ici, c'est que même si tu codes en TypeScript, Chrome comprendra que du JavaScript, et tout ton code TypeScript est transformé en JavaScript un jour ou l'autre. Et Chrome comprend que JavaScript. Et malgré cet inconvénient, TypeScript... en 2023, il est devenu le cinquième langage le plus utilisé pour te dire au-dessus de Java et même PHP. Mais c'est quoi TypeScript concrètement ? Il faut comprendre qu'en JavaScript, il n'y a aucune règle. C'est ce qu'on appelle un langage très permissif, c'est-à-dire qu'on va pouvoir passer d'un nombre à une string, à un objet et le changement de type de données est totalement autorisé du moment que tu utilises une variable let. C'est ce qu'on peut dire un langage à typage dynamique ou non strict. Et ce genre de choses peut créer des problèmes. Par exemple, si je crée une méthode deleteUserName qui prend en paramètre un user et que j'essaie de modifier user.name en tant que undefined, et bien quand tu écris ce code, il n'y aura pas de problème, c'est-à-dire que JavaScript te dira que tout est OK parce qu'il ne check pas les paramètres. Et donc, lors du runtime, c'est-à-dire lors de l'exécution de ton code sur un navigateur ou autre part, tu vas avoir un crash total de l'application, ce qui peut évidemment être très problématique suivant où est-ce qu'il apparaît, qui va dire, bah... moi je ne peux pas modifier name en sachant que user n'existe même pas. Et donc, ce genre de problème arrive très rarement quand tu es tout seul, quand tu es sur ta propre code base qui est relativement petite. Mais il faut bien comprendre que quand il y a beaucoup de développeurs, et bien ça devient explosif parce que tu ne comprends pas forcément ce que l'autre développeur a voulu faire et le code passe de main en main constamment, ce qui vient évidemment créer des problèmes. Ils ont créé TypeScript comme étant l'alternative à JavaScript, mais en étant un langage typé. Qu'est-ce que ça veut dire un langage typé ? Et bien quand je fais le même code qu'avant en disant let value et que je viens lui rajouter un type en lui disant c'est un number et que j'essaie ensuite de l'assigner à une string, et bien je vais avoir une erreur comme quoi la string n'est pas assignable au type number. Et ça... Ça, c'est super parce que ça permet de nous éviter d'avoir des erreurs. Encore mieux, TypeScript arrive à comprendre ton code afin d'inférer automatiquement, sans même avoir besoin de spécifier number juste ici. TypeScript va venir inférer, c'est-à-dire détecter que 144, c'est un type number. Il va venir le donner au type de value juste ici. 144 est un nombre, donc value est lui aussi un nombre. Et donc, de la même manière, quand je fais le code d'avant, let value est égal à 144. value est égal à une string, on a encore une fois une erreur parce que la string n'est pas assignable au type de number. Tout simplement parce que TypeScript arrive à détecter que value est de type number. Evidemment on peut faire bien plus que ça en TypeScript. On va pouvoir par exemple faire la création d'un type. Donc ici tu vois que je définis un type user qui prend comme propriété name qui est string ou undefined. Et ensuite je vais pouvoir créer une fonction delete username qui prend en paramètre user de type user et faire username ici est égal à undefined. Et tout ça, c'est OK parce que j'ai précisé que name était de type string ou undefined. Et donc là, quand je vais appeler delete username avec aucun paramètre, je vais avoir une erreur comme quoi user n'a pas été donné. Et donc, je vais éviter de mettre ce code là en production parce que je vais voir l'erreur avant de le publier. Parlons justement des types parce que c'est la plus grande chose en TypeScript. On va avoir des opérateurs où ? qui permettent de définir par exemple string ou undefined, qui nous permettent du coup de définir un user avec soit une string, soit undefined de manière totalement autorisée. On va aussi pouvoir ajouter undefined automatiquement avec point d'interrogation, deux points. On va pouvoir utiliser l'opérateur et pour pouvoir merger ou undefined. étendre des types. Donc par exemple ici on a user qui a name, on a user admin qui étend user avec can delete user et donc user admin accept name et can delete user. On va avoir en plus de ça ce qu'on appelle des utility type qui sont des types créés par TypeScript pour nous simplifier la vie. Par exemple ici je peux avoir mon type user avec trois propriétés et avec le utility type pick je vais venir récupérer name et age de mon user. De la même manière, je vais pouvoir utiliser omit pour récupérer un type en enlevant une propriété. Donc par exemple ici city. On aura aussi record qui permet de créer un type d'objet qui va définir le type de la clé et le type de la valeur et qui permet ensuite de créer ce genre de choses. Et énormément d'autres. TypeScript, c'est un langage complet et complexe. Complet parce que tu peux faire des choses comme ceci. Tu vois qu'ici c'est vraiment du pur TypeScript avec uniquement du TypeScript et ça devient très compliqué même. explosif. Ce type permet par exemple de venir sortir d'une string la valeur qui est entourée de deux accolades de cette manière. Mais évidemment tout ça, il n'y a pas besoin de tout savoir. Ça c'est réservé aux mainteneurs de librairies alors que pour les utilisateurs on va plutôt se contenter des utility type et du typage de l'infération dynamique de TypeScript. Voici en gros pour cette vidéo sur TypeScript. J'espère pas avoir dépassé. Si tu as aimé, like et abonne-toi. Et dans la description tu pourras trouver un cours sur TypeScript Next.js. qu'est-ce que c'est que la quérie qui a été suivi par plus de 600 élèves on se retrouve juste ici à tout de suite