Un opérateur d'affectation permet d'assigner une valeur à son opérande gauche en se basant sur la valeur de son opérande droit.
Le code source de cet exemple interactif est disponible dans un dépôt GitHub. Si vous souhaitez contribuez à ces exemples, n'hésitez pas à cloner https://github.com/mdn/interactive-examples et à envoyer une pull request !
L'opérateur utilisé pour l'affectation est le symbole égal (=), il permet d'affecter la valeur de l'opérande droit à son opérande gauche. Ainsi, quand on écrit x = y, on affecte la valeur de y à x. Les autres opérateurs d'affectation sont généralement des raccourcis pour des opérations standards. Ils sont décrits ci-après avec définitions et exemples.
| Nom | Opérateur (raccourci) | Signification |
|---|---|---|
| Affectation | x = y |
x = y |
| Affectation après addition | x += y |
x = x + y |
| Affectation après soustraction | x -= y |
x = x - y |
| Affectation après multiplication | x *= y |
x = x * y |
| Affectation après division | x /= y |
x = x / y |
| Affectation du reste | x %= y |
x = x % y |
| Affectation après exponentiation | x **= y |
x = x ** y |
| Affectation après décalage à gauche | x <<= y |
x = x << y |
| Affectation après décalage à droite | x >>= y |
x = x >> y |
| Affectation après décalage à droite non-signé | x >>>= y |
x = x >>> y |
| Affectation après ET binaire | x &= y |
x = x & y |
| Affectation après OU exclusif binaire | x ^= y |
x = x ^ y |
| Affectation après OU binaire | x |= y |
x = x | y |
L'opérateur d'affectation simple permet d'assigner une valeur à une variable. Le résultat de l'affectation est la valeur affectée. Il est possible de chaîner plusieurs opérateurs d'affectation afin d'assigner une même valeur à plusieurs variables. Voir l'exemple ci-après.
Opérateur : x = y
// Si on dispose des variables suivantes : // x = 5; // y = 10; // z = 25; x = y; // x vaudra désormais 10 x = y = z; // x, y et z valent désormais tous 25
Cet opérateur permet d'ajouter la valeur de l'opérande droit à une variable, le résultat de l'addition étant affecté à cette variable. Les types des deux opérandes déterminent le comportement de l'opérateur. Selon le type, on pourra en effet avoir une addition ou une concaténation. Voir la page sur l'opérateur d'{{jsxref("Opérateurs/Opérateurs_arithmétiques", "addition", "#Addition_(.2B)", 1)}} pour plus d'informations.
Opérateur : x += y Signification : x = x + y
// Si on dispose des variables suivantes : // toto = "toto"; // truc = 5; // machin = true; // Nombre + Nombre -> addition truc += 2; // 7 // Booléen + Booléen -> addition machin += 1; // 2 // Booléen + Booléen -> addition machin += false; // 1 // Nombre + String -> concaténation truc += "toto"; // "5toto" // String + Booléen -> concaténation toto += false; // "totofalse" // String + String -> concaténation toto += "truc"; // "tototruc"
Cet opérateur soustrait la valeur de l'opérande droit à la variable puis affecte le résultat de cette soustraction à la variable. Voir la page sur l'opérateur de {{jsxref("Opérateurs/Opérateurs_arithmétiques", "soustraction", "#Soustraction_(-)", 1)}} pour plus d'information.
Opérateur : x -= y Signification : x = x - y
// Si on a la variable suivante : // truc = 5; truc -= 2; // 3 truc -= "toto"; // NaN
Cet opérateur permet de multiplier une variable par la valeur de l'opérande droit et d'affecter le résultat de cette opération à la variable. Voir la page sur l'opérateur de {{jsxref("Opérateurs/Opérateurs_arithmétiques", "multiplication", "#Multiplication_(*)", 1)}} pour plus d'informations.
Opérateur : x *= y Signification : x = x * y
// Si on a la variable suivante : // truc = 5; truc *= 2; // 10 truc *= "toto"; // NaN
Cet opérateur permet de diviser une variable par la valeur de l'opérande droit et d'affecter le résultat de cette opération à la variable. Voir la page sur l'opérateur de {{jsxref("Opérateurs/Opérateurs_arithmétiques", "division", "#Division_(.2F)", 1)}} pour plus d'informations.
Opérateur : x /= y Signification : x = x / y
// Si on a la variable suivante : // truc = 5; truc /= 2; // 2.5 truc /= "toto"; // NaN truc /= 0; // Infinity
Cet opérateur permet de divisier une variable par la valeur de l'opérande droit et d'affecter le reste de cette division à la variable. Pour plus d'informations, voir la page sur l'opérateur {{jsxref("Opérateurs/Opérateurs_arithmétiques", "reste", "#Reste_(.25)", 1)}}.
Opérateur : x %= y Signification : x = x % y
// Si on a la variable suivante : // truc = 5; truc %= 2; // 1 truc %= "toto"; // NaN truc %= 0; // NaN
L'opérateur d'affectation après exponentiation renvoie le résultat de l'élévation du premier opérande à la puissance donnée par le second opérande. Pour plus de détails, voir la page sur {{jsxref("Opérateurs/Opérateurs_arithmétiques", "l'opérateur d'exponentiation", "#Exponentiation_(**)", 1)}} for more details.
Opérateur : x **= y Signification : x = x ** y
// Si on a la variable : // toto = 5 toto **= 2 // 25 toto **= "truc" // NaN
Cet opérateur permet de décaler un nombre donné de bits vers la gauche, le résultat de l'opération est ensuite affecté à la variable. Voir la page sur l'opérateur de {{jsxref("Opérateurs/Opérateurs_binaires", "décalage à gauche", "#.3C.3C_.28d.C3.A9calage_.C3.A0_gauche.29", 1)}} pour plus d'informations.
Opérateur : x <<= y Signification : x = x << y
var toto = 5; // (00000000000000000000000000000101) toto <<= 2; // 20 (00000000000000000000000000010100)
Cet opérateur permet de décaler un nombre donné de bits vers la droite, le résultat de l'opération est ensuite affecté à la variable. Voir la page sur l'opérateur de {{jsxref("Opérateurs/Opérateurs_binaires", "décalage à droite", "##.3E.3E_.28d.C3.A9calage_.C3.A0_droite_avec_propagation_du_signe.29", 1)}} pour plus d'informations.
Opérateur : x >>= y Signification : x = x >> y
var toto = 5; // (00000000000000000000000000000101) toto >>= 2; // 1 (00000000000000000000000000000001) var toto -5; // (-00000000000000000000000000000101) toto >>= 2; // -2 (-00000000000000000000000000000010)
Cet opérateur permet de décaler le contenu de la variable d'un nombre de bits donné pour ensuite affecter le résultat à la variable. Voir la page sur l'opérateur de {{jsxref("Opérateurs/Opérateurs_binaires", "décalage à droite non-signé", "#.3E.3E.3E_.28d.C3.A9calage_.C3.A0_droite_avec_insertion_de_z.C3.A9ros.29", 1)}} pour plus de détails.
Opérateur : x >>>= y Signification : x = x >>> y
var toto = 5; // (00000000000000000000000000000101) toto >>>= 2; // 1 (00000000000000000000000000000001) var toto = -5; // (-00000000000000000000000000000101) toto >>>= 2; // 1073741822 (00111111111111111111111111111110)
Cet opérateur effectue une opération ET binaire sur les deux opérandes et affecte le résultat de l'opération à la variable (l'opérande gauche). Pour plus d'informations sur cette opération, voir la page sur l'opérateur {{jsxref("Opérateurs/Opérateurs_binaires", "binaire ET", "#&_.28ET_binaire.29", 1)}}.
Opérateur : x &= y Signification : x = x & y
var truc = 5; // 5: 00000000000000000000000000000101 // 2: 00000000000000000000000000000010 truc &= 2; // 0
Cet opérateur utilise une représentation binaire des deux opérandes, effectue une opération binaire avec un OU exclusif et affecte le résultat à la variable. Pour plus d'informations sur cette opération, voir la page sur l'opérateur {{jsxref("Opérateurs/Opérateurs_binaires", "binaire OU exclusif", "#.5E_.28XOR_binaire.29", 1)}}.
Opérateur : x ^= y Signification : x = x ^ y
var toto = 5; toto ^= 2; // 7 // 5: 00000000000000000000000000000101 // 2: 00000000000000000000000000000010 // ----------------------------------- // 7: 00000000000000000000000000000111
Cet opérateur utilise une représentation binaire des deux opérandes, effectue un OU logique binaire entre ces deux variables et affecte le résultat de l'opération à la variable. Pour plus de détails sur cette opération, voir la page sur l'opérateur {{jsxref("Opérateurs/Opérateurs_binaires", "OU binaire", "#|_.28OU_binaire.29", 1)}}.
Opérateur : x |= y Signification : x = x | y
var toto = 5; toto |= 2; // 7 // 5: 00000000000000000000000000000101 // 2: 00000000000000000000000000000010 // ----------------------------------- // 7: 00000000000000000000000000000111
Dans certains cas, l'opérateur d'affectation (par exemple x += y) n'est pas identique à l'expression développée correspondante (respectivement x = x + y). Lorsque l'opérande gauche contient lui-même un opérateur d'affectation, l'opérande gauche n'est évalué qu'une fois. Ainsi :
a[i++] += 5 // i est évalué une fois a[i++] = a[i++] + 5 // i est évalué deux fois
| Spécification | État | Commentaires |
|---|---|---|
| {{SpecName('ESDraft', '#sec-assignment-operators', 'Assignment operators')}} | {{Spec2('ESDraft')}} | |
| {{SpecName('ES2015', '#sec-assignment-operators', 'Assignment operators')}} | {{Spec2('ES2015')}} | |
| {{SpecName('ES5.1', '#sec-11.13', 'Assignment operators')}} | {{Spec2('ES5.1')}} | |
| {{SpecName('ES1', '#sec-11.13', 'Assignment operators')}} | {{Spec2('ES1')}} | Définition initiale |
{{Compat("javascript.operators.assignment")}}