Sommaire
- 3.1 Syntaxe
- 3.2 Mots-clés et Mots Réservés
- 3.3 Variables
- 3.4 Types de Données
- 3.4.1 Opérateur typeof
- 3.4.2 Type Undefined
- 3.4.3 Type Null
- 3.4.4 Type Boolean
- 3.4.5 Type Number
- 3.4.6 Type String
- 3.4.7 Type Symbol
- 3.4.8 Objet Object
- 3.5 Opérateurs
- 3.5.1 Opérateurs Unaires
- 3.5.2 Opérateurs Bit à Bit
- 3.5.3 Opérateurs Logiques
- 3.5.4 Opérateurs Multiplicatifs
- 3.5.5 Opérateur d'Exposant
- 3.5.6 Opérateurs Additifs
- 3.5.7 Opérateurs de Relation
- 3.5.8 Opérateurs d'Égalité
- 3.5.9 Opérateur Conditionnel
- 3.5.10 Opérateurs d'Affectation
- 3.5.11 Opérateur Virgule
- 3.6 Instructions
- 3.7 Fonctions
3.1 Syntaxe
- Sensibilité à la casse : En ECMAScript, tout est sensible à la casse, que ce soit les variables, les noms de fonctions ou les opérateurs.
- Identifiants : Noms de variables, fonctions, propriétés ou paramètres de fonction. Le premier caractère d'un identifiant doit être une lettre, un trait de soulignement (_) ou le symbole dollar ($). Les caractères suivants peuvent être des lettres, des chiffres, des traits de soulignement ou des dollars. Les mots-clés, les mots réservés,
true,falseetnullne peuvent pas être utilisés comme identifiants. - Mode Strict : ECMAScript 5 a introduit le mode strict (strict mode). Il s'agit d'un modèle d'analyse et d'exécution différent de JavaScript, où certaines pratiques non standard d'ECMAScript 3 sont traitées comme des erreurs. L'objectif de cette syntaxe est de ne pas cassser la grammaire d'ECMAScript 3. Le mode strict affecte de nombreux aspects de l'exécution de JavaScript et est supporté par tous les navigateurs modernes.
- Point-virgule en fin d'instruction : Le point-virgule indique clairement à l'analyseur où l'instruction se termine. Sinon, l'interpréteur doit déterminer lui-même la fin de l'instruction, ce qui réduit les performances. Ajouter des points-virgules aide également à compresser le code en supprimant les espaces et permet aux développeurs de savoir clairement si une instruction est terminée.
- Blocs de code : Les blocs de code sont délimités par des accolades
{}. Il est préférable d'ajouter des accolades à toutes les instructions de contrôle pour plus de clarté et pour réduire les risques d'erreur lors de modifications ultérieures du code.
3.2 Mots-clés et Mots Réservés
- Mots-clés : Ont une signification spéciale, par exemple pour le début et la fin des instructions de contrôle ou pour effectuer des opérations particulières. Les mots-clés ne peuvent pas être utilisés comme identifiants ou noms de propriétés.
- Mots Réservés : Sont susceptibles de devenir des mots-clés à l'avenir et ne peuvent également pas être utilisés comme identifiants ou noms de propriétés.
3.3 Variables
Les variables en ECMAScript peuvent stocker n'importe quel type de données. Chaque variable est simplement un espace de stockage nommé pouvant contenir une valeur quelconque. Les variables sont déclarées avec var, let ou const.
Mot-clé var (utilisable dans toutes les versions d'ECMAScript)
var txtInitial; // Sans initialisation, la variable contient la valeur spéciale undefined.
var msg = 'Bonjour'; // Déclaration et initialisation.
var element = 'page';
element = 42; // Le type de données peut changer.
var pseudo = 'Alice',
statut = false,
age = 25;
// Portée
function traiter() {
var interne = 'Donnée locale';
}
traiter();
console.log(interne); // Erreur ! Une variable définie avec `var` devient locale à la fonction qui l'encapsule.
// Élévation (hoisting)
function calculer() {
console.log(total); // undefined
var total = 100;
}
calculer();
// Le code ci-dessus ne génère pas d'erreur car il est équivalent à :
function calculer() {
var total; // L'élévation place toutes les déclarations de variables en haut de la portée de la fonction.
console.log(total);
total = 100;
}
// Déclarations multiples avec var
function afficher() {
var compteur = 10;
var compteur = 20;
var compteur = 30;
console.log(compteur); // 30, équivalent à une seule déclaration en haut suivie de réaffectations.
}
Déclaration avec let (ES 6 et versions ultérieures)
- La portée d'une variable déclarée avec
letest la portée de bloc, tandis quevara une portée de fonction. - La portée de bloc est un sous-ensemble de la portée de fonction. Les restrictions de portée applicables à
vars'appliquent aussi àlet. letetvarn'autorisent pas les déclarations redondantes. Notez que la propriété d'élévation devaraugmente sa tolérance aux erreurs.- La caractéristique de portée de bloc de
letpermet d'utiliser le même identifiant dans des blocs imbriqués sans erreur. varetletne déclarent pas des types de variables différents ; ils indiquent simplement la portée de la variable.- Zone morte temporelle (Temporal Dead Zone) : Les variables déclarées avec
letne sont initialisées que lorsque leur définition est exécutée. Accéder à la variable avant son initialisation provoque uneReferenceError. La variable se trouve dans une "zone morte" depuis le haut du bloc jusqu'à son initialisation.
// age n'est pas élévé
console.log(age); // ReferenceError: age is not defined
let age = 30;
- Déclaration globale : Les variables déclarées avec
vardans la portée globale deviennent des propriétés de l'objetwindow, tandis que celles déclarées avecletne le deviennent pas. - Déclaration conditionnelle avec let : Une variable déclarée avec
letà l'intérieur d'une instruction conditionnelle est limitée au bloc de cette condition ; elle est considérée comme non déclarée en dehors de ce bloc. - Déclaration avec let dans une boucle for
for (var idx = 0; idx < 4; idx++) {
// Logique de boucle
}
console.log(idx); // 4, la variable de boucle déclarée avec var s'infiltre à l'extérieur de la boucle.
for (let i = 0; i < 4; i++) {
// Logique de boucle
}
console.log(i); // ReferenceError, elle ne s'infiltre pas.
for (var j = 0; j < 3; j++) {
setTimeout(() => console.log(j), 0);
}
// 3, 3, 3 - La logique asynchrone s'exécute après la sortie de la boucle, lorsque la valeur de j est déjà 3.
for (let k = 0; k < 3; k++) {
setTimeout(() => console.log(k), 0);
}
// 0, 1, 2 - Le moteur JavaScript crée en arrière-plan une nouvelle variable d'itération pour chaque itération de la boucle.
Déclaration avec const (ES 6 et versions ultérieures)
- Une variable déclarée avec
constdoit être initialisée lors de sa déclaration, et toute tentative de modification entraîne une erreur d'exécution. - Redéclaration interdite.
- La portée est également celle du bloc.
- Si une variable
constréférence un objet, modifier les propriétés internes de cet objet ne viole pas la restriction deconst. - On ne peut pas utiliser
constpour déclarer la varible d'itération d'une boucle, car celle-ci doit être incrémentée. Cependant, si l'on souhaite une variable qui reste constante à chaque itération,constpeut être utilisé.
for (const valeur of [10, 20, 30, 40]) {
console.log(valeur);
}
// 10, 20, 30, 40
3.4 Types de Données
ECMAScript possède 6 types de données simples (primitifs) : undefined, null, boolean, number, string et symbol (ajouté dans ECMAScript 6). Il y a 1 type de données complexe : Object. Un Object est une collection non ordonnée de paires nom-valeur. ECMAScript ne permet pas de définir ses propres types de données ; toutes les valeurs peuvent être représentées par l'un des 7 types mentionnés.
3.4.1 Opérateur typeof
let donnee = "test";
console.log(typeof donnee); // "string" - typeof est un opérateur, l'utilisation de parenthèses est optionnelle.
console.log(typeof (donnee)); // "string"
console.log(typeof 101); // "number"
console.log(typeof null); // "object" - considéré comme une référence à un objet vide.
3.4.2 Type undefined
Le type undefined n'a qu'une seule valeur : la valeur spéciale undefined. Lorsqu'une variable est déclarée avec var ou let sans être initialisée, elle se voit automatiquement attribuer la valeur undefined.
let marque;
console.log(marque == undefined); // true
console.log(marque); // undefined
console.log(age); // Erreur ! age n'est pas déclaré.
console.log(typeof marque); // "undefined"
console.log(typeof age); // "undefined" - Même non déclarée, typeof renvoie "undefined".
3.4.3 Type null
Le type null n'a également qu'une seule valeur : la valeur spéciale null. Logiquement, la valeur null représente un pointeur d'objet vide.
let vehicule = null;
console.log(typeof vehicule); // "object"
console.log(null == undefined); // true - undefined est dérivé de null, donc ECMAScript les considère comme superficiellement égaux.
let objet = null; // Initialiser avec null facilite la distinction avec undefined et conserve la signification de pointeur d'objet vide.
let compteur;
if (objet) { /* Ce bloc ne s'exécute pas */ }
if (!objet) { /* Ce bloc s'exécute */ }
if (compteur) { /* Ce bloc ne s'exécute pas */ }
if (!compteur) { /* Ce bloc s'exécute */ }
3.4.4 Type boolean
Le type boolean a deux valeurs littérales : true et false. Ces valeurs booléennes sont différentes des valeurs numériques ; true n'est pas égal à 1 et false n'est pas égal à 0. En JavaScript, les valeurs booléennes sont sensibles à la casse.
Toutes les autres valeurs en ECMAScript peuvent être converties en valeurs booléennes via la fonction de conversion Boolean().
Boolean(String); // Les chaînes non vides donnent true, la chaîne vide donne false.
Boolean(Number); // Les nombres non nuls et la valeur infinie donnent true, 0 et NaN donnent false.
Boolean(Object); // Tout objet donne true, null donne false.
Boolean(undefined); // undefined donne false.
3.4.5 Type number
Le type number utilise le format IEEE 754 (standard pour l'arithmétique en virgule flottante binaire) pour représenter les entiers et les nombres à virgule flottante (valeurs double précision).
let entierDecimal = 57; // Entier décimal.
let entierOctal = 0o71; // 57 en octal (syntaxe ES6).
let entierHexa = 0xB; // 11 en hexadécimal.
- Valeurs flottantes
let flottant1 = 1.1;
let flottant2 = .7; // 0.7
let flottant3 = 1.; // Traité comme 1.
let flottant4 = 10.0; // Traité comme 10 (converti en entier).
let flottant5 = 1.23e8; // Notation scientifique.
// La précision va jusqu'à 17 décimales.
- Plage de valeurs : La plus petite valeur est stockée dans
Number.MIN_VALUE(généralement5e-324), la plus grande dansNumber.MAX_VALUE(environ1.7976931348623157e+308). Au-delà, les valeurs sont converties enInfinity(positive ou négative). La fonctionisFinite()permet de vérifier si une valeur est finie. - NaN (Not a Number) : Une valeur numérique spéciale indiquant qu'une opération devant renvoyer un nombre a échoué. Toute opération impliquant
NaNretourneNaN.NaNn'est égal à aucune valeur, y compris lui-même. La fonctionisNaN()teste si une valeur n'est pas numérique.
0 / 0; // NaN
NaN == NaN; // false
isNaN("texte"); // true (car "texte" ne peut être converti en nombre)
isNaN("42"); // false (car "42" peut être converti en 42)
- Conversion en nombre : Trois fonctions sont disponibles :
Number(),parseInt()etparseFloat().
Number(true); // 1
Number(null); // 0
Number(undefined); // NaN
Number(""); // 0
Number("0x1A"); // 26
parseInt("42abc"); // 42
parseInt(""); // NaN
parseInt("0xA"); // 10
parseInt("071", 8); // 57 (interprétation octale)
parseInt("110", 2); // 6 (interprétation binaire)
parseFloat("3.14e2"); // 314
parseFloat("0.123.45"); // 0.123
3.4.6 Type string
Une string (chaîne de caractères) représente une séquence de zéro ou plusieurs caractères Unicode 16 bits. Les chaînes peuvent être délimitées par des guillemets doubles ("), simples (') ou des backticks (```).
- Littéraux de caractères :
\n(nouvelle ligne),\t(tabulation),\x41("A"),\u03A3(lettre grecque Sigma majuscule). - Immuabilité : Les chaînes en ECMAScript sont immuables. Pour modifier une chaîne, il faut en créer une nouvelle et la réaffecter à la variable.
- Conversion en chaîne : Méthode
toString()(disponible sur les nombres, booléens, objets et chaînes, mais pas surnullouundefined) et fonctionString()(fonctionne pour tous les types).
let age = 25;
age.toString(); // "25"
(100).toString(2); // "1100100" (binaire)
let val = true;
String(val); // "true"
String(null); // "null"
String(undefined); // "undefined"
- Littéraux de gabarit (Template Literals) : Délimités par des backticks (```), ils conservent les retours à la ligne, les espaces et l'indentation, permettant de définir des chaînes sur plusieurs lignes.
- Interpolation de chaînes : Les littéraux de gabarit supportent l'interpolation via
${expression}. Les expressions sont évaluées et converties en chaînes.
let nom = "Marie";
let message = `Bonjour, ${nom} ! Aujourd'hui nous sommes le ${new Date().toLocaleDateString()}.`;
function capitaliser(mot) {
return `${mot.charAt(0).toUpperCase()}${mot.slice(1)}`;
}
console.log(`${capitaliser('javascript')} est génial !`); // "Javascript est génial !"
- Fonctions d'étiquettes (Tag Functions) : Permettent de personnaliser le traitement de l'interpolation. La fonction reçoit un tableau de chaînes brutes et les valeurs interpolées.
- Chaînes brutes (Raw Strings) : L'étiquette
String.rawpermet d'accéder au contenu brut du littéral de gabarit, sans traitement des séquences d'échappement.
3.4.7 Type symbol
Le type symbol (symbole) est un type de données primitif ajouté dans ECMAScript 6. Une instance de symbol est unique et immutable. Son utilisation principale est de créer des identifiants uniques pour les propriétés d'objet, évitant ainsi les conflits de noms.
let sym1 = Symbol();
typeof sym1; // "symbol"
let symDesc = Symbol('identifiant');
console.log(symDesc.toString()); // "Symbol(identifiant)"
// Deux symboles avec la même description sont toujours distincts.
let s1 = Symbol('clé');
let s2 = Symbol('clé');
console.log(s1 === s2); // false
// Mise en commun via la table de registre globale.
let symGlobal1 = Symbol.for('service_api');
let symGlobal2 = Symbol.for('service_api');
console.log(symGlobal1 === symGlobal2); // true
// Utilisation comme propriété d'objet.
const ID_UTILISATEUR = Symbol('id');
let utilisateur = {
[ID_UTILISATEUR]: 12345,
nom: "Dupont"
};
console.log(utilisateur[ID_UTILISATEUR]); // 12345
console.log(Object.keys(utilisateur)); // ["nom"] - Les symboles ne sont pas énumérables de cette manière.
console.log(Object.getOwnPropertySymbols(utilisateur)); // [Symbol(id)]
3.4.8 Objet Object
En ECMAScript, un objet est un regroupement de données et de fonctionnalités. Les objets sont créés avec l'opérateur new suivi du nom du type d'objet. Les développeurs peuvent créer leurs propres objets via l'instance Object et leur ajouter des propriétés et méthodes.
let monObjet = new Object();
monObjet.propriete = "valeur";
// Chaque objet possède les propriétés et méthodes suivantes (entre autres) :
// constructor, hasOwnProperty(), isPrototypeOf(), propertyIsEnumerable(), toString(), valueOf().
3.5 Opérateurs
Les opérateurs en ECMAScript sont uniques car ils peuvent être appliqués à divers types de valeurs, y compris les chaînes, les nombres, les booléens et même les objets. Ils tentent généralement de convertir les valeurs en nombres ou en chaînes pour effectuer l'opération.
3.5.1 Opérateurs Unaires
Un opérateur qui agit sur une seule valeur.
- Incrément/Décrément :
i++(post-incrémentation) ajoute 1 après l'utilisation de la valeur ;++i(pré-incrémentation) ajoute 1 avant l'utilisation. - Unaire + et - : Appliqués à une valeur non numérique, ils la convertissent en nombre. Une chaîne non numérique est convertie en
NaN.
3.5.2 Opérateurs Bit à Bit
Les opérations bit à bit convertissent d'abord les opérandes en entiers 32 bits, effectuent l'opération, puis reconvertissent le résultat.
- NON bit à bit (
~), ET bit à bit (&), OU bit à bit (|), OU exclusif bit à bit (^). - Décalage à gauche (
<<), décalage à droite avec signe (>>), décalage à droite sans signe (>>>).
3.5.3 Opérateurs Logiques
- NON logique (
!) : Convertit l'opérande en booléen et renvoie l'inverse. Double NON (!!valeur) équivaut àBoolean(valeur). - ET logique (
&&) : Court-circuit. Si le premier opérande est évalué àfalse, renvoie cette valeur ; sinon, renvoie la valeur du second opérande. - OU logique (
||) : Court-circuit. Si le premier opérande est évalué àtrue, renvoie cette valeurr ; sinon, renvoie la valeur du second opérande. Souvent utilisé pour fournir une valeur par défaut.
let valeurFournie = null;
let valeurParDefaut = "défaut";
let resultat = valeurFournie || valeurParDefaut; // "défaut"
3.5.4 Opérateurs Multiplicatifs
- Multiplication (
*), Division (/), Modulo (%). - Certaines combinaisons avec
Infinityou0donnent des résultats particuliers (ex:Infinity * 0donneNaN).
3.5.5 Opérateur d'Exposant
L'opérateur d'exposant (**), disponible depuis ECMAScript 7, calcule la puissance. L'opérateur d'affectation correspondant est **=.
let base = 2;
let puissance = 10;
console.log(base ** puissance); // 1024
3.5.6 Opérateurs Additifs
- Addition (
+) : Si l'un des opérandes est une chaîne, l'autre est converti en chaîne et les deux sont concaténés. - Soustraction (
-) : Convertit toujours les opérandes en nombres.
3.5.7 Opérateurs de Relation
Opérateurs de comparaison (<, >, <=, >=) qui renvoient un booléen. La comparaison entre NaN et n'importe quelle valeur renvoie toujours false.
"23" < "3"; // true (comparaison lexicographique des chaînes)
"23" < 3; // false (conversion de "23" en 23)
NaN < 3; // false
NaN >= 3; // false
3.5.8 Opérateurs d'Égalité
- Égalité simple (
==) et Inégalité simple (!=) : Effectuent des conversions de type avant la comparaison. - Égalité stricte (
===) et Inégalité stricte (!==) : Ne convertissent pas les types. Il est recommandé de privilégier ces opérateurs pour éviter des comportements inattendus.
null == undefined; // true
null === undefined; // false (types différents)
"55" == 55; // true (conversion de type)
"55" === 55; // false (types différents)
NaN === NaN; // false
3.5.9 Opérateur Conditionnel
let max = (a > b) ? a : b;
3.5.10 Opérateurs d'Affectation
Syntaxe abrégée pour les opérations d'affectation combinées (ex: +=, -=, *=, /=, %=, <<=, >>=, >>>=, &=, ^=, |=, **=).
3.5.11 Opérateur Virgule
Permet d'évaluer plusieurs expressions dans une seule instruction, en renvoyant la valeur de la dernière expression.
let x = (1 + 2, 3 + 4, 5 + 6); // x vaut 11 (le résultat de 5+6)
3.6 Instructions
if,if...elsedo...while: Le corps de la boucle s'exécute au moins une fois.whilefor: Équivalent àwhilepour la logique de boucle.for...in: Énumère les propriétés non symboliques d'un objet. L'ordre n'est pas garanti.for...of: Itère sur les éléments d'un objet itérable (tableau, chaîne, Map, Set, etc.).- Instructions étiquetées (Labels) : Permettent d'identifier une instruction pour y faire référence avec
breakoucontinue. break: Sort immédiatement de la boucle ou de l'instruction étiquetée.continue: Saute à l'itération suivante de la boucle courante ou étiquetée.with: Étend la portée d'une instruction (déconseillé en production).switch: Compare une expression à plusieurs cas. Supporte tous les types de données.
let couleur = "bleu";
switch (couleur) {
case "rouge":
console.log("Rouge");
break;
case "bleu":
case "vert":
console.log("Froid");
break;
default:
console.log("Autre");
}
let score = 85;
switch (true) {
case score >= 90:
console.log("A");
break;
case score >= 80:
console.log("B");
break;
// ...
}
3.7 Fonctions
- Les fonctions en ECMAScript ne nécessitent pas de spécifier explicitement si elles renvoient une valeur.
- L'instruction
returnpeut être utilisée sans valeur de retour. Dans ce cas, la fonction s'arrête immédiatement et renvoieundefined. - Les fonctions ne peuvent pas avoir pour nom ou paramètre les identifiants
evalouarguments.