JavaScript (JS) : c’est quoi ?

Le JavaScript (ou JS pour les intimes)

• Une définition ça vous dit ?
• Pourquoi on utilise le JavaScript ?
• Les frameworks JavaScript
• Exemples de JavaScript

Une définition, ça vous dit ?

Le JavaScript est un langage de programmation dit « client », c’est-à-dire qu’il est exécuté par votre navigateur Web. Il permet d’interagir avec les éléments HTML (images, textes, etc.). Il est aussi appelé JS, car l’extension des fichiers JavaScript c’est .js et que son abréviation est également JS. À ne pas confondre avec le Java, qui est un autre type de langage et qui ne sera pas mentionné ici.

Pourquoi on utilise le JavaScript ?

Le JS est utilisé pour créer et gérer des actions sur les éléments HTML. Il peut servir de complément au CSS. Par exemple : on a une animation CSS qui est arrêtée et on voudrait la démarrer, il suffit de créer une action qui exécutera une classe CSS ce qui fera démarrer l’animation. Il sert également à valider les formulaires de contact et autres types de formulaires. Toutefois, les validations des formulaires peuvent se faire aussi côté serveur, donc avec un autre type de langage (PHP par exemple). Les carrousels d’images sont également animés par du JavaScript. Il existe plusieurs actions possibles avec le JavaScript.

Cliquez sur le bouton suivant pour voir un exemple d’animation:

Jouer l’animation!

Jouer à l’envers!

Les frameworks JavaScript

Il existe beaucoup de framework JS, je vais en nommer que quelques uns. Un framework c’est quoi? C’est un ensemble de fonctionnalités qui permettent de vous faciliter la vie en n’ayant pas besoin de réécrire des fonctions déjà existantes et en réduisant la quantité de code JavaScript que vous devez écrire.

Voici une liste des frameworks les plus connus :

• jQuery
• ReactJS
• Angular

Toutefois, il en existe beaucoup d’autres. Les frameworks jQuery et React sont utilisés sous WordPress :

• jQuery est utilisé par les extensions, thèmes et par WordPress lui-même.
• React est utilisé par l’éditeur WYSIWYG Gutenberg et le nouveau système de widgets à bloc basé sur Gutenberg.

Exemples de JavaScript

Voyons un exemple de code JS sans framework qui récupère le prénom d’un formulaire dont l’attribut ID du champ texte est first_name et ajoute la valeur à la variable JavaScript first_name :

<script>
lat first_name = document.getElementById("first_name").value;
</script> :

Et voici un exemple jQuery qui fait la même chose que le code précédent.

<script>
lat first_name = $("#first_name").val();
</script>

Comme vous voyez, il y a moins de code avec un framework et les deux codes font exactement la même chose.

En terminant

Comme vous avez pu le voir, le JavaScript exécute des actions avant d’envoyer au serveur ou tout simplement pour améliorer l’affichage en complément au CSS et HTML. Si vous avez des questions ou besoins d’aide, n’hésitez pas à nous contacter.