Javascript : les outils

Comme pour chaque langage de programmation, pour commencer à travailler avec JavaScript il faut au moins trois outils :

• un éditeur de texte
• un interprète ou compilateur
• un débogueur (ou debugger en anglais)

Vous pouvez utiliser un éditeur de texte commun. Beaucoup d’éditeurs ont maintenant des capacités de support au développement de différents langages de programmation, dont aussi le JavaScript : coloration syntaxique, totalement automatique, code snippet. Grâce aussi a certains plugins, certains editors deviennent des véritables environnements de développement intégré, comme par exemple :

• Notepad++ qui a à sa disposition des plugins pour formater le code, pour effectuer l’analyse statique par rapport aux règles de codage, pour générer une version compacte du script, etc. (son unique “défaut”, c’est d’être disponible uniquement sur Windows) ;
• Sublime text qui consent, entre autres, de définir des véritables build system et qui est disponible sur Windows, Linux e Mac.

D’autre part, même les environnements de développement intégrés traditionnels tels que Visual Studio et Eclipse, offrent maintenant un support spécifique pour JavaScript. En fait, Eclipse fournit un package spécialisé pour ce langage de programmation de scripts : Eclipse JavaScript Development Tools.

Certains de ces environnements de développement fournissent un interprète ou un compilateur intégré ou, comme il est souvent appelé, un moteur JavaScript, mais bien sûr, en fonction de nos besoins, nous pouvons toujours utiliser le moteur d’un navigateur web.

Il y a encore quelques années JavaScript était seulement un langage interprété. La demande croissante de performances plus élevées a également conduit à la création de moteurs qui proposent une compilation en temps réel (JIT, Just In compilation Time) en bytecode ou même en code machine. Voici quelques-uns des moteurs les plus importants :

• V8 de Google, utilisé dans Chrome et node.js ;
• Chakra de Microsoft, le moteur d’Internet Explorer ;
• SpiderMonkey de Mozilla monté sur Firefox.

Outils de développement dans les navigateurs

Les environnements de développement qui fournissent un moteur ont généralement un débogueur intégré qui vous permet d’analyser votre code dès qu’il est exécuté. En l’absence d’un environnement de développement intégré, nous pouvons toujours utiliser un navigateur web populaire qui fournit un environnement de débogage. Par exemple, l’image ci-dessous montre une capture d’écran de DevTools Chrome :

Console

Bien sûr, Internet Explorer et Firefox ont des environnements similaires à DevTools de Chrome et les trois navigateurs offrent un environnement pour l’exécution directe du code JavaScript, la console.

Dans cette fenêtre spéciale vous pouvez écrire du code JavaScript pour voir son exécution immédiate. Tous les exemples que nous fournissons peuvent être exécutes à l’intérieur de la console de votre navigateur préféré pour vérifier le bon fonctionnement.

La même console peut être utilisée pour vérifier l’affichage d’un script, grâce à l’objets du même nom console, comme le montre l’image ci-dessous :

Il est très courant d’utiliser dans le code la méthode console.log pour suivre l’évolution du programme ou de vérifier rapidement la valeur des objets et des variables.

 var a = 'salut';
console.log('a = ' + a); // affichera : "a = salut"

Même si parfois, c’est mieux travailler avec des expressions Watch e le debugger step-by-step, cette méthode est souvent la plus immédiate.

➡️ Cours JavaScript : maîtrisez les fondamentaux du langage de programmation web

Voila, vous pouvez maintenant briller en soirée …

Formations de Develop4fun

• Parcours pour devenir un programmeur web
• Cours JavaScript : maîtrisez les fondamentaux du langage de programmation web
• Apprendre à coder en HTML et CSS : Cours Complet
• Parcours pour devenir un programmeur de jeux vidéo
• Apprenez à créer des jeux 2D facilement avec LUA et LÖVE 2D
• Apprenez à programmer en C#
• Apprenez à programmer en C++