⚡ JavaScript

Voici la traduction de l'article du russe vers le français, en respectant toutes les règles :

Qu'est-ce que c'est et pourquoi ?

Imagine que tu donnes des ordres à un robot. Tu dis : « Robot, allume la lumière », et il l'allume. Mais pour que le robot comprenne, il faut lui parler dans un langage spécial. Il en va de même avec l'ordinateur : pour qu'il fasse quelque chose, il faut lui donner une commande dans un langage de programmation.

JavaScript (en abrégé JS) est l'un de ces langages. Il est très populaire car il permet de « dynamiser » les pages web. Quand tu vas sur un site et que tu vois une image s'agrandir au survol de la souris, ou un menu qui se déroule, ou des fenêtres contextuelles qui apparaissent — il y a de fortes chances que ce soit fait avec JavaScript.

Faisons une analogie. Imagine que tu es un professeur de sport. Tu dis aux élèves : « Classe, levez-vous ! », « Levez la main droite ! », « Faites un pas en avant ! ». Si tu dis « Levez-vous » en chinois, personne ne comprendra. Il faut un langage compréhensible. JavaScript est justement ce langage compréhensible pour le navigateur (le programme par lequel tu consultes les sites, par exemple Chrome, Firefox, Safari).

Pourquoi apprendre JavaScript ?

  • Il est partout : presque tous les sites web utilisent JavaScript.
  • Il est visuel : tu vois immédiatement le résultat de tes actions.
  • Il est simple pour débuter : pour écrire ton premier programme, tu n'as pas besoin d'installer des logiciels complexes — un simple bloc-notes et un navigateur suffisent.
  • Il est recherché : les programmeurs qui connaissent JavaScript sont très demandés par les entreprises.

Dans cet article, nous allons apprendre à installer les « outils » pour travailler avec JavaScript et écrire notre tout premier programme — « Hello, World! ». C'est une tradition chez tous les programmeurs : le premier programme affiche toujours ce message de bienvenue. Considère-le comme le « premier pas » dans le monde de la programmation.

Si tu connais déjà Python : En Python, tu écrivais print("Hello, World!"). En JavaScript, cela sera un peu différent, mais le sens est le même : afficher du texte à l'écran.


Exemples de code avec explications

Avant d'écrire du code, préparons notre « espace de travail ». Tu auras besoin de deux choses :

  1. Un navigateur (Chrome, Firefox, Edge, Safari — n'importe lequel fera l'affaire).
  2. Un éditeur de texte — un programme où tu écriras le code. L'option la plus simple est le « Bloc-notes » (Windows) ou « TextEdit » (Mac) en mode texte brut. Mais il est préférable de télécharger un éditeur spécialisé, comme VS Code (Visual Studio Code) — il est gratuit et très pratique.

Comment vérifier que tout fonctionne ? Il y a deux façons d'exécuter JavaScript :

  • Directement dans le navigateur (console) : Appuie sur F12 (ou Ctrl+Shift+I) sur ton clavier, ouvre l'onglet « Console » et écris le code directement. C'est rapide, mais pas pratique pour les gros programmes.
  • Via un fichier HTML : Nous allons créer un fichier avec l'extension .html, à l'intérieur duquel se trouvera notre code JavaScript. C'est la méthode correcte.

Commençons par la deuxième méthode. Crée un nouveau dossier sur ton ordinateur, nomme-le par exemple « Cours_JS ». À l'intérieur, crée un fichier nommé index.html (il est important que l'extension soit .html, pas .txt). Ouvre ce fichier dans ton éditeur de texte.

Insères-y ce modèle de base :




    
    Mon premier programme



    

    











Maintenant, enregistre le fichier et ouvre-le dans ton navigateur (double-clique simplement dessus). Tu verras une page vide. Rien ne s'est encore passé car nous n'avons pas écrit de code. Corrigeons cela !


Exemple 1 : Le classique « Hello, World! »

La façon la plus simple d'afficher du texte est d'utiliser la commande alert(). Elle affiche une fenêtre contextuelle avec un message. Insère le code suivant entre les balises <script> et </script> :

// Ceci est un commentaire. L'ordinateur l'ignore.
// Il sert à expliquer le code aux humains.

// alert() est une fonction intégrée (comme une commande).
// Elle affiche une fenêtre avec un message.
alert('Bonjour le monde !'); // Le texte que nous voulons afficher s'écrit entre guillemets.

Que va-t-il se passer ? Quand tu ouvriras (ou actualiseras) la page, une fenêtre apparaîtra avec le texte « Bonjour le monde ! ». Pour la fermer, il faut cliquer sur « OK ».

Analyse :

  • alert — c'est le nom de la commande. Elle dit au navigateur : « Affiche une fenêtre ».
  • Les parenthèses () — on y place ce que l'on veut dire. Dans ce cas, du texte.
  • Les guillemets ' ' — ils sont nécessaires pour que l'ordinateur comprenne qu'il s'agit de texte, et non d'une commande. On peut aussi utiliser des guillemets doubles " ".
  • Le point-virgule ; — c'est comme un point à la fin d'une phrase. Il indique : « La commande est terminée ». Il faut le mettre après chaque commande.

Comparaison avec Python : En Python, tu aurais écrit print("Bonjour le monde !"). La différence est que print affiche le texte dans la console, alors que alert l'affiche dans une fenêtre contextuelle.


Exemple 2 : Affichage dans la console du développeur

Les fenêtres contextuelles ne sont pas très pratiques si l'on doit afficher beaucoup d'informations. Les programmeurs utilisent plus souvent la console — un endroit spécial pour le débogage. Pour y afficher du texte, on utilise la commande console.log().

Remplace le code précédent dans <script> par celui-ci :

// console est un objet (une structure complexe) qui gère la console.
// .log() est une méthode (une action) qui écrit un message dans la console.

console.log('Ceci est un message dans la console !');
console.log('On peut afficher un nombre :', 42);
console.log('On peut afficher