Blog

Qu'est-ce que JavaScript ?

Qu’est-ce que le Javascript ?

JavaScript est un langage de script ou de programmation qui vous permet de mettre en œuvre des fonctionnalités complexes sur des pages web. Chaque fois qu'une page web fait plus que rester assise et afficher des informations statiques que vous pouvez consulter - affichage de mises à jour de contenu opportunes, de cartes interactives, de graphiques animés en 2D/3D, de jukebox vidéo défilant, etc. Il s'agit de la troisième couche du gâteau de couches des technologies web standard, dont deux (HTML et CSS) que nous avons couvertes de manière beaucoup plus détaillée dans d'autres parties de l'espace de formation.

  • Le HTML est le langage de balisage que nous utilisons pour structurer et donner un sens à notre contenu web, par exemple pour définir les paragraphes, les titres et les tableaux de données, ou pour intégrer des images et des vidéos dans la page.
  • Le CSS est un langage de règles de style que nous utilisons pour appliquer un style à notre contenu HTML, par exemple en définissant les couleurs de fond et les polices, et en disposant notre contenu sur plusieurs colonnes.
  • Le JavaScript est un langage de script qui permet de créer des contenus mis à jour dynamiquement, de contrôler le multimédia, d'animer des images et à peu près tout le reste. (D'accord, pas tout, mais c'est étonnant ce que vous pouvez réaliser avec quelques lignes de code JavaScript).

Les trois couches se superposent joliment. 

Alors, que peut-il vraiment faire ?

Le langage JavaScript de base côté client est constitué de quelques caractéristiques de programmation communes.

Stocker des valeurs utiles dans des variables. On demande d'entrer un nouveau nom puis on stocke ce nom dans une variable appelée name.

Opérations sur des morceaux de texte (appelés "chaînes de caractères" en programmation). Dans l'exemple ci-dessus, nous prenons la chaîne "Player 1 : " et nous la joignons à la variable name pour créer l'étiquette de texte complète, par exemple ''Player 1 : Chris''.

Code d'exécution en réponse à certains événements survenant sur une page web. Dans notre exemple ci-dessus, nous avons utilisé un événement de clic pour détecter le moment où le bouton est cliqué, puis nous avons exécuté le code qui met à jour l'étiquette de texte.

Et bien plus encore !

Mais ce qui est encore plus passionnant, c'est la fonctionnalité construite en plus du langage JavaScript côté client. Les interfaces de programmation d'applications (API) vous offrent des super-pouvoirs supplémentaires à utiliser dans votre code JavaScript.

Que sont les API ?

Les API sont des ensembles de blocs de code prêts à l'emploi qui permettent à un développeur de mettre en œuvre des programmes qui seraient autrement difficiles ou impossibles à réaliser. Pour la programmation, elles font la même chose que les kits de meubles prêts à l'emploi pour la construction de maisons : il est beaucoup plus facile de prendre des panneaux prédécoupés et de les visser pour en faire une étagère que d'élaborer soi-même le design, d'aller chercher le bon bois, de couper tous les panneaux à la bonne taille et à la bonne forme, de trouver les vis de la bonne taille, puis de les assembler pour en faire une étagère.

Que fait JavaScript sur votre page ?

Récapitulons brièvement ce qui se passe lorsque vous chargez une page web dans un navigateur (dont nous avons parlé pour la première fois dans notre article "Comment fonctionne le CSS"). Lorsque vous chargez une page web dans votre navigateur, vous exécutez votre code (le HTML, le CSS et le JavaScript) dans un environnement d'exécution (l'onglet du navigateur). C'est comme une usine qui reçoit des matières premières (le code) et fabrique un produit (la page web).

Une utilisation très courante du JavaScript consiste à modifier dynamiquement le HTML et le CSS pour mettre à jour une interface utilisateur, via l'API Document Object Model (comme mentionné ci-dessus). Notez que le code de vos documents web est généralement chargé et exécuté dans l'ordre où il apparaît sur la page. Si le JavaScript se charge et essaie de s'exécuter avant que le HTML et le CSS qu'il affecte n'aient été chargés, des erreurs peuvent se produire. Vous apprendrez comment contourner ce problème plus tard dans l'article, dans la section Stratégies de chargement des scripts.

Sécurité des navigateurs

Chaque onglet du navigateur possède sa propre zone d'exécution (ces zones sont appelées "environnements d'exécution" en termes techniques), ce qui signifie que dans la plupart des cas, le code de chaque onglet est exécuté séparément et que le code d'un onglet ne peut pas affecter directement le code d'un autre onglet ou d'un autre site web. C'est une bonne mesure de sécurité - si ce n'était pas le cas, les pirates pourraient alors commencer à écrire du code pour voler des informations sur d'autres sites web, et d'autres choses aussi mauvaises.

Remarque : il existe des moyens d'envoyer du code et des données entre différents sites web/onglets de manière sûre, mais ce sont des techniques avancées que nous ne couvrirons pas dans ce cours.

Ordre de marche de JavaScript

Lorsque le navigateur rencontre un bloc de JavaScript, il l'exécute généralement dans l'ordre, de haut en bas. Cela signifie que vous devez faire attention à l'ordre dans lequel vous mettez les choses. JavaScript est un langage de programmation interprété léger. 

Le navigateur web reçoit le code JavaScript sous sa forme de texte original et exécute le script à partir de celui-ci. 

D'un point de vue technique, la plupart des interprètes JavaScript modernes utilisent en fait une technique appelée "compilation juste à temps" pour améliorer les performances ; le code source JavaScript est compilé dans un format binaire plus rapide pendant l'utilisation du script, afin qu'il puisse être exécuté le plus rapidement possible. Toutefois, JavaScript est toujours considéré comme un langage interprété, puisque la compilation est effectuée au moment de l'exécution, plutôt qu'à l'avance.