JavaScript, Typescript, tout le monde en parle mais qu’est-ce que c’est réellement ? ARCA Computing vous dit tout sur ces langages incontournables dans un projet web.
JavaScript, définition
Le JavaScript (ou JS), est un langage de programmation. C’est à dire qu’il met à disposition des développeurs un ensemble de règles, de mots clés et de conventions grâce auxquels les développeurs seront capables de décrire les comportements et les interactions possibles d’un projet informatique. C’est ce qu’on appelle le code source du projet.
Pourquoi le JavaScript ?
Dans les années 1990, au tout début de l’histoire d’Internet, un site web c’était : du HTML, et un peu de CSS pour le style. Ils ne pouvaient afficher que du contenu statique et immuable. Mais très vite, il a fallu rajouter des interactions : des animations avancées, des boutons qui lancent une succession d’actions, mettre à jour telle partie d’une page à partir d’une autre, etc.
C’est pour répondre à ces besoins que le JavaScript est né. Il permet de manipuler facilement le DOM (Document Object Model, les éléments de votre page web), et d’effectuer des opérations comme n’importe quel autre langage, mais avec à l’origine une volonté de simplicité de prise en main, car il devait pouvoir être compris par des designers pas forcément technophiles et non pas seulement par des développeurs chevronnés. Rapidement adopté par tous les navigateurs, le JavaScript est désormais le langage de référence pour les applications web. C’est donc l’un des langages les plus faciles à approcher puisqu’il suffit de posséder un navigateur web pour pouvoir exécuter du JS.
Dans les entrailles du JavaScript
En JS, tout est objet. Cela signifie que quelle que soit la donnée, sa forme et sa complexité, elle sera considérée comme une structure possédant des ramifications (comme un dossier possède des sous dossiers et des fichiers). On dit alors que le JavaScript est un langage non typé. En réalité, il est faiblement typé : il existe des types dits primitifs (c’est-à-dire simples et que le JavaScript saura interpréter) dans ce langage, mais en nombre limité. On retrouve parmi ces types les plus courants : les nombres, les chaînes de caractères, puis les tableaux et les objets qui permettent de définir des structures de données plus complexes. Ainsi, à partir de ces 4 types (plus les booléens, on y reviendra) a été défini le JSON (JavaScript Object Notation), qui se retrouve être le format de prédilection pour les API Web. Au delà de ces types primitifs, il est difficile de faire la différence entre deux structures différentes (puisque le code nous dira: c’est un objet).
#1 Flexibilité
Contrairement à certains autres langages, il est même possible de rajouter des méthodes ou des attributs à un objet (c’est-à-dire, en reprenant la métaphore précédente, rajouter un fichier) après sa création. C’est même la principale caractéristique de ce langage, il est extrêmement flexible. Il est donc très facile de composer la donnée au fur et à mesure de l’utilisation, et d’adapter très facilement la donnée brute aux besoins de l’application. Malheureusement, cela reste aussi l’une de ses faiblesses. Puisqu’on peut rajouter et supprimer des morceaux de la structure de données, on peut rapidement se retrouver à appeler des données qui n’existent pas… ou plus !
#2 Simplicité
Une autre particularité de ce langage, c’est qu’il n’est pas compilé, mais interprété directement par le navigateur. Ainsi, chacun peut très facilement commencer à expérimenter en JS dans sa console (cherchez les outils de développement dans votre navigateur). Cela implique aussi que chaque navigateur doit implémenter un « moteur » capable d’interpréter ce code, selon des normes appelées ECMAScript. Ces normes définissent une « version » du JS et les mots-clés et les méthodes « par défaut » utilisables pour cette version. Il est aussi très bien supporté par la communauté et vos moindres questions ont sûrement déjà été posées. Il permet donc de commencer avec des programmes très simples et de progresser vers les utilisations les plus complexes et ainsi d’apprendre les bases de la programmation.
#3 Dangers
Le non typage de ce langage est aussi une caractéristique importante. Cela signifie qu’on peut comparer des grandeurs sans aucunes relation sans s’en apercevoir et sans générer d’erreurs. Il en résulte quelques incohérences qui forcent les développeurs à la plus grande prudence, puisque JavaScript va tenter de deviner le type à tout prix. C’est la coercition : plutôt que d’échouer à réaliser une commande, les entrées de cette commande vont d’abord être converties implicitement au plus proche du type primitif attendu pour ensuite renvoyer un résultat. Il est par exemple possible de comparer des booléens (soit vrai, soit faux), avec des nombres, car en JS les valeurs « vrai » et « faux » sont en réalité… des nombres !
TypeScript, le JS des temps modernes
Depuis sa création, le JavaScript a beaucoup évolué, et a gagné en popularité partout autour du globe. Il s’est même éloigné de ses fonctions premières, puisqu’il est désormais possible d’écrire des projets qui ne s’appliquent pas du tout à un site web ! Pour répondre à ces nouveaux besoins, et aux problèmes évoqués dans la première partie, Microsoft a développé et publié un nouveau langage, le TypeScript, qui est un superset du JavaScript. Cela signifie que tout programme écrit en JavaScript fonctionnera naturellement en TypeScript, mais celui-ci apporte 2 fonctionnalités majeures.
#1 Typage de données et inférence
Comme son nom l’indique, la première « révolution » du TypeScript est le typage : on pallie au manquement de JavaScript en définissant nos types de structures, et surtout en vérifiant que les types utilisés dans les méthodes sont les bons. C’est pendant le développement que le code va afficher une erreur nous disant « Non, cette fonction ne peut pas prendre ce type de données en entrée ». Il est donc facile de le corriger et de prévoir les comportements, là ou le JavaScript tentait à tout prix d’effectuer l’opération, au risque d’échouer ou de renvoyer des résultats incohérents.
#2 Un JavaScript toujours à jour
Nous l’évoquions précédemment, le JavaScript est défini par des normes régulièrement mises à jour… Mais les navigateurs ne suivent pas forcément. Le TypeScript assure l’utilisation des toutes nouvelles fonctionnalités, puis retraduit ce code dans un JavaScript compatible avec une certaine version des normes ECMAScript. On s’assure ainsi de la compatibilité du projet sur un maximum de plateformes !
Quels usages pour ces langages ?
Vous l’aurez compris, une majeure partie des projets en JavaScript ou TypeScript sont fait pour générer des sites et des applications web. On différencie ici les sites qui proposent du contenu relativement statique (par exemple, ce blog), des applications qui sont des outils plus complexes (comme par exemple une boite mail en ligne). Mais il est désormais possible de faire des logiciels (à installer sur votre ordinateur), des applications mobiles, des scripts sans interfaces utilisateurs, etc.
La plupart du temps, des frameworks existent pour simplifier la vie des développeurs. Un framework est un ensemble de fonctions et de solutions qui traitent un problème donné, permettant de ne pas repartir de zéro à chaque nouveau projet. Ils dépendent donc fortement du problème auquel vous êtes confrontés. Certains proposent même des fonctionnalités dites « natives », c’est à dire qui exécutent du code qui dépendent de la plateforme (une notification sous Windows ne ressemblera pas à une notification sous OSX).
– Sites et applications web : dans ce domaine, les frameworks les plus répandus sont Angular, React, et Vue. Il en existent bien d’autres, comme Backbone, Svelte, jQuery, etc.
– Logiciels : le plus connu est Electron, mais aussi NW.js, Meteor, …
– Applications mobiles : on peut citer à nouveau Angular, mais aussi Cordova, Ionic ou encore ReactNative
– Scripts : tous les scripts reposeront sur Node.js, auquel on peut rajouter d’autres frameworks comme Express pour réaliser une API web
Attention toutefois à l’utilisation des frameworks. Il vous faudra toujours apprendre son fonctionnement, voir même de le réapprendre lors d’une grosse mise à jour. De plus, à toujours vouloir en faire plus pour le plus grand nombre, ils peuvent parfois en faire trop et alourdir inutilement un projet. Alors que le JS est un langage très complet et que les dernières versions se rapprochent de plus en plus de ce que les framework tentaient de pallier !
Pingback: Une brève histoire du frontend | ARCA Computing()