HTML: Markup language
CSS: Styling language
JavaScript: Scripting language
Web APIs: Programming interfaces
All web technology
Learn web development
Discover our tools
Get to know MDN better
Cette page a été traduite à partir de l'anglais par la communauté. Vous pouvez contribuer en rejoignant la communauté francophone sur MDN Web Docs.
View in English Always switch to English
Ce chapitre introduit JavaScript et présente certains de ses concepts fondamentaux.
Pour lire ce guide, il est conseillé d'avoir :
La documentation MDN pour JavaScript comprend :
JavaScript est un langage de script, multi-plateforme et orienté objet. C'est un langage léger qui doit faire partie d'un environnement hôte (un navigateur web par exemple) pour qu'il puisse être utilisé sur les objets de cet environnement.
JavaScript contient une bibliothèque standard d'objets tels que Array, Date, et Math, ainsi qu'un ensemble d'éléments de langage tels que les opérateurs, les structures de contrôles et les instructions. Ces fonctionnalités centrales et natives de JavaScript peuvent être étendues de plusieurs façons en fournissant d'autres objets, par exemple :
Array
Date
Math
Cela signifie que, dans le navigateur, JavaScript peut modifier l'apparence de la page web (DOM). De même, JavaScript Node.js côté serveur peut répondre à des requêtes personnalisées envoyées par du code exécuté dans le navigateur.
JavaScript et Java se ressemblent sur certains aspects, mais ils sont fondamentalement différents l'un de l'autre. Le langage JavaScript ressemble à Java, mais n'est pas typé statiquement et le typage de JavaScript est faible (alors qu'il est fort en Java). La syntaxe des expressions JavaScript est très proche de celle du Java avec les conventions de nommage et les constructions conditionnelles par exemple : c'est une des raisons qui a fait que le langage LiveScript a été renommé en JavaScript.
À la différence de Java qui est un système compilé et dont les classes sont déclarées, JavaScript est traité lors de l'exécution et possède quelques types de données pour représenter les nombres, les booléens et les chaînes de caractères (entre autres). JavaScript utilise un modèle basé sur les prototypes pour représenter les liens entre les objets alors que Java utilise un modèle plus courant basé sur les classes. Les prototypes permettent d'avoir un héritage dynamique. Ainsi, les caractéristiques héritées par un objet peuvent varier dans le temps. JavaScript supporte également les fonctions qui sont des objets à part entière et qui peuvent être des propriétés d'autres objets.
JavaScript est un langage plutôt « libre » comparé au Java. Il n'est pas nécessaire de déclarer toutes les variables, classes et méthodes. Il n'est pas nécessaire de savoir si une méthode est publique, privée ou protégée et il n'y a pas d'interfaces à implémenter. Les variables, les paramètres et les valeurs de retour des fonctions ne sont pas explicitement typés.
Java est un langage de programmation utilisant les classes, conçus pour être exécuté rapidement et garantir la sûreté du typage. Cela signifie par exemple qu'il n'est pas possible de transformer un entier Java en un objet ou qu'on ne peut pas accéder à des caractéristiques privées en corrompant le bytecode Java. Le modèle de classes utilisé par Java signifie qu'un programme n'est constitué que de classes et de méthodes. Cet héritage à base de classes, associé au typage fort font qu'on obtient des structures et des hiérarchies d'objets fortement couplées. Pour ces raisons, Java peut apparaître comme un langage plus complexe que JavaScript.
À l'inverse, JavaScript est un descendant de langages plus légers, dynamiquement typés tels que HyperTalk et dBASE. Ces langages de scripts visent un public plus large avec une syntaxe plus simple, des fonctionnalités natives spécialisées et des prérequis minimaux pour pouvoir créer des objets.
JavaScript est standardisé par Ecma International (angl.) — une association européenne de standardisation des systèmes d'information et de communication (ECMA étant historiquement un acronyme pour European Computer Manufacturers Association) qui délivre un langage de programmation standardisé, international appelé ECMAScript. Ce langage se comporte de la même façon pour toutes les applications qui supportent ce standard. Les entreprises peuvent utiliser ce langage standard afin de développer leur implémentation de JavaScript. Le standard ECMAScript est documenté avec la spécification ECMA-262.
Le standard ECMA-262 est également approuvé par l'ISO (angl.) (International Organization for Standardization) sous ISO-16262. La spécification peut également être trouvée sur le site web d'Ecma International (angl.). La spécification ECMAScript ne décrit pas le Document Object Model (DOM) qui est standardisé par le World Wide Web Consortium (W3C) (angl.) et le WHATWG (Web Hypertext Application Technology Working Group) (angl.). Le DOM définit la façon dont les documents HTML sont exposés aux scripts. Pour mieux comprendre les différentes technologies gravitant autour de JavaScript, voir l'article Aperçu des technologies JavaScript.
La spécification ECMAScript est un ensemble de conditions à respecter pour implémenter ECMAScript : cela est utile lorsqu'on souhaite implémenter des fonctionnalités standard du langage au sein d'une implémentation ou d'un moteur ECMAScript (tel que SpiderMonkey pour Firefox, ou V8 pour Chrome).
La spécification ECMAScript n'a pas pour but d'aider les développeur·euse·s à écrire des scripts. La documentation JavaScript permet d'obtenir des informations pour écrire des scripts JavaScript.
La spécification ECMAScript utilise parfois une terminologie et une syntaxe qui peuvent sembler étranges aux yeux d'un développeur·euse JavaScript. Bien que la description du langage diffère entre ECMAScript et la documentation JavaScript, le langage lui-même reste le même. JavaScript supporte l'ensemble des fonctionnalités mises en avant dans la spécification ECMAScript.
La documentation JavaScript décrit les aspects du langage qui pourront être utilisés par les développeur·euse·s JavaScript.
Pour commencer à utiliser JavaScript, il suffit d'avoir un navigateur web moderne. Les versions récentes de Firefox, Chrome, Microsoft Edge et Safari prennent toutes en charge les fonctionnalités abordées dans ce guide.
Un outil très utile pour explorer JavaScript est la console JavaScript (parfois appelée console web, ou simplement console) : il s'agit d'un outil qui permet de saisir du JavaScript et de l'exécuter dans la page courante.
Les captures d'écran ici montrent la console web de Firefox (angl.), mais tous les navigateurs modernes sont livrés avec une console qui fonctionne de manière similaire.
Les instructions exactes pour ouvrir la console varient selon le navigateur :
La console apparaît en bas de la fenêtre du navigateur. Le long du bas de la console se trouve une ligne de saisie que vous pouvez utiliser pour entrer du JavaScript, et la sortie apparaît dans le panneau au-dessus :
La console fonctionne exactement comme eval : la dernière expression saisie est renvoyée. Pour simplifier, on peut imaginer qu'à chaque fois que quelque chose est saisi dans la console, cela est en fait entouré par console.log autour de eval, comme ceci :
eval
console.log
console.log(eval("3 + 5"));
Par défaut, si vous appuyez sur Entrée (ou Retour, selon votre clavier) après avoir saisi une chaîne de caractères (string en anglais) de code, celle-ci est exécutée. Pour saisir plusieurs lignes :
function foo() {
Pour commencer à écrire du JavaScript, ouvrez la console, copiez le code suivant et collez-le à l'invite :
(function () { "use strict"; // Début de votre code function saluerMoi(votreNom) { alert(`Bonjour ${votreNom}`); } saluerMoi("le Monde"); // Fin de votre code })();
Appuyez sur Entrée pour voir le résultat dans votre navigateur !
Dans les pages suivantes, ce guide vous présente la syntaxe de JavaScript et les fonctionnalités du langage, afin que vous puissiez écrire des applications plus complexes.
Mais pour l'instant, souvenez-vous d'inclure toujours (function(){"use strict"; avant votre code, et d'ajouter })(); à la fin de votre code. Les articles sur le mode strict et sur les IIFE expliquent ce que cela fait, mais pour l'instant, on peut considérer que cela permet :
(function(){"use strict";
})();