diff options
Diffstat (limited to 'files/fr/web/javascript/guide/expressions_and_operators/index.html')
| -rw-r--r-- | files/fr/web/javascript/guide/expressions_and_operators/index.html | 934 |
1 files changed, 934 insertions, 0 deletions
diff --git a/files/fr/web/javascript/guide/expressions_and_operators/index.html b/files/fr/web/javascript/guide/expressions_and_operators/index.html new file mode 100644 index 0000000000..fc922c49ce --- /dev/null +++ b/files/fr/web/javascript/guide/expressions_and_operators/index.html @@ -0,0 +1,934 @@ +--- +title: Expressions et opérateurs +slug: Web/JavaScript/Guide/Expressions_et_Opérateurs +tags: + - Débutant + - Expressions + - Guide + - JavaScript + - Operators +translation_of: Web/JavaScript/Guide/Expressions_and_Operators +--- +<p>{{jsSidebar("JavaScript Guide")}} {{PreviousNext("Web/JavaScript/Guide/Fonctions", "Web/JavaScript/Guide/Nombres_et_dates")}}</p> + +<p class="summary">Ce chapitre décrit les expressions et les opérateurs en JavaScript, il inclut des notions sur les opérateurs d'affectation, de comparaison, les opérateurs arithmétiques, binaires, logiques, ceux qui s'appliquent sur les chaînes de caractères ainsi que les opérateurs spéciaux.</p> + +<p>Une liste complète et détaillée des opérateurs JavaScript est disponible dans <a href="/fr/docs/Web/JavaScript/Reference/Opérateurs">la référence JavaScript</a>.</p> + +<h2 id="Opérateurs">Opérateurs</h2> + +<p>JavaScript possède différents types d'opérateurs. Cette section décrit les opérateurs et certaines informations sur les priorités entre opérateurs.</p> + +<ul> + <li><a href="/fr/docs/Web/JavaScript/Guide/Expressions_et_Opérateurs#Opérateurs_d'affectation">Les opérateurs d'affectation</a></li> + <li><a href="/fr/docs/Web/JavaScript/Guide/Expressions_et_Opérateurs#Opérateurs_de_comparaison">Les opérateurs de comparaison</a></li> + <li><a href="/fr/docs/Web/JavaScript/Guide/Expressions_et_Opérateurs#Opérateurs_arithmétiques">Les opérateurs arithmétiques</a></li> + <li><a href="/fr/docs/Web/JavaScript/Guide/Expressions_et_Opérateurs#Opérateurs_binaires">Les opérateurs binaires</a></li> + <li><a href="/fr/docs/Web/JavaScript/Guide/Expressions_et_Opérateurs#Opérateurs_logiques">Les opérateurs logiques</a></li> + <li><a href="/fr/docs/Web/JavaScript/Guide/Expressions_et_Opérateurs#Opérateurs_de_chaînes_de_caractères">Les opérateurs de chaînes</a></li> + <li><a href="/fr/docs/Web/JavaScript/Guide/Expressions_et_Opérateurs#Opérateur_conditionnel_ternaire">L'opérateur (ternaire) conditionnel</a></li> + <li><a href="/fr/docs/Web/JavaScript/Guide/Expressions_et_Opérateurs#La_virgule_comme_opérateur">L'opérateur virgule</a></li> + <li><a href="/fr/docs/Web/JavaScript/Guide/Expressions_et_Opérateurs#Opérateurs_unaires">Les opérateurs unaires</a></li> + <li><a href="/fr/docs/Web/JavaScript/Guide/Expressions_et_Opérateurs#Opérateurs_relationnels">Les opérateurs relationnels</a></li> +</ul> + +<p>JavaScript utilise des opérateurs <em>binaires</em> et <em>unaires</em>, ainsi qu'un opérateur ternaire spécial (l'opérateur conditionnel). Un opérateur binaire utilise deux opérandes, un précédant l'opérateur et un lui succédant :</p> + +<pre class="syntaxbox"><em>opérande1</em> <em>opérateur</em> <em>opérande2</em> +</pre> + +<p>Par exemple : « <code>3+4</code> » ou « <code>x*y</code> ».</p> + +<p>Un opérateur unaire ne nécessite qu'un opérande, avant ou après l'opérateur :</p> + +<pre class="syntaxbox"><em>opérateur</em> <em>opérand</em>e</pre> + +<p>ou</p> + +<pre class="syntaxbox"><em>opérande</em> <em>opérateur</em></pre> + +<p>Comme « <code>x++</code> » ou « <code>++x</code> ».</p> + +<h3 id="Opérateurs_daffectation">Opérateurs d'affectation</h3> + +<p>Un <a href="/fr/docs/Web/JavaScript/Reference/Opérateurs/Opérateurs_d_affectation">opérateur d'affectation</a> assigne une valeur à son opérande gauche, valeur basée sur celle de l'opérande droit. L'opérateur d'affectation simple est le signe égal (=), il assigne la valeur de l'opérande droit à l'opérande gauche. Autrement dit, avec « x = y » on affecte la valeur y à x.</p> + +<p>D'autres opérateurs d'affectation sont des raccourcis correspondant à certaines opérations composées, ils sont énumérés dans le tableau qui suit :</p> + +<table class="standard-table"> + <caption>Opérateurs d'affectation</caption> + <thead> + <tr> + <th scope="col">Nom</th> + <th scope="col">Opérateur composé</th> + <th scope="col">Signification</th> + </tr> + </thead> + <tbody> + <tr> + <td><a href="/fr/docs/Web/JavaScript/Reference/Op%C3%A9rateurs/Op%C3%A9rateurs_d_affectation#Affectation">Affectation</a></td> + <td><code>x = y</code></td> + <td><code>x = y</code></td> + </tr> + <tr> + <td><a href="/fr/docs/Web/JavaScript/Reference/Op%C3%A9rateurs/Op%C3%A9rateurs_d_affectation#Affectation_apr%C3%A8s_addition">Affectation après addition</a></td> + <td><code>x += y</code></td> + <td><code>x = x + y</code></td> + </tr> + <tr> + <td><a href="/fr/docs/Web/JavaScript/Reference/Op%C3%A9rateurs/Op%C3%A9rateurs_d_affectation#Affectation_apr%C3%A8s_soustraction">Affectation après soustraction</a></td> + <td><code>x -= y</code></td> + <td><code>x = x - y</code></td> + </tr> + <tr> + <td><a href="/fr/docs/Web/JavaScript/Reference/Op%C3%A9rateurs/Op%C3%A9rateurs_d_affectation#Affectation_apr%C3%A8s_multiplication">Affectation après multiplication</a></td> + <td><code>x *= y</code></td> + <td><code>x = x * y</code></td> + </tr> + <tr> + <td><a href="/fr/docs/Web/JavaScript/Reference/Opérateurs/Opérateurs_d_affectation#Affectation_après_division">Affectation après division</a></td> + <td><code>x /= y</code></td> + <td><code>x = x / y</code></td> + </tr> + <tr> + <td><a href="/fr/docs/Web/JavaScript/Reference/Opérateurs/Opérateurs_d_affectation#Affectation_du_reste">Affectation du reste</a></td> + <td><code>x %= y</code></td> + <td><code>x = x % y</code></td> + </tr> + <tr> + <td><a href="/fr/docs/Web/JavaScript/Reference/Opérateurs/Opérateurs_d_affectation#Affectation_après_exponentiation">Affectation après exponentiation</a>{{experimental_inline}}</td> + <td><code>x **=y</code></td> + <td><code>x = x ** y</code></td> + </tr> + <tr> + <td><a href="/fr/docs/Web/JavaScript/Reference/Opérateurs/Opérateurs_d_affectation#Affectation_après_décalage_à_gauche">Affectation après décalage à gauche</a></td> + <td><code>x <<= y</code></td> + <td><code>x = x << y</code></td> + </tr> + <tr> + <td><a href="/fr/docs/Web/JavaScript/Reference/Opérateurs/Opérateurs_d_affectation#Affectation_après_décalage_à_droite">Affectation après décalage à droite</a></td> + <td><code>x >>= y</code></td> + <td><code>x = x >> y</code></td> + </tr> + <tr> + <td><a href="/fr/docs/Web/JavaScript/Reference/Opérateurs/Opérateurs_d_affectation#Affectation_après_décalage_à_droite_non-signé">Affectation après décalage à droite non signé</a></td> + <td><code>x >>>= y</code></td> + <td><code>x = x >>> y</code></td> + </tr> + <tr> + <td><a href="/fr/docs/Web/JavaScript/Reference/Opérateurs/Opérateurs_d_affectation#Affectation_après_ET_binaire">Affectation après ET binaire</a></td> + <td><code>x &= y</code></td> + <td><code>x = x & y</code></td> + </tr> + <tr> + <td><a href="/fr/docs/Web/JavaScript/Reference/Opérateurs/Opérateurs_d_affectation#Affectation_après_OU_exclusif_(XOR)_binaire">Affectation après OU exclusif binaire</a></td> + <td><code>x ^= y</code></td> + <td><code>x = x ^ y</code></td> + </tr> + <tr> + <td><a href="/fr/docs/Web/JavaScript/Reference/Opérateurs/Opérateurs_d_affectation#Affectation_après_OU_binaire">Affectation après OU binaire</a></td> + <td><code>x |= y</code></td> + <td><code>x = x | y</code></td> + </tr> + </tbody> +</table> + +<h4 id="Décomposition">Décomposition</h4> + +<p>Lors d'affectations plus complexes, on peut utiliser <a href="/fr/docs/Web/JavaScript/Reference/Opérateurs/Affecter_par_décomposition">l'affectation par décomposition</a>. C'est une expression qui permet d'extraire des données depuis des tableaux ou des objets avec une syntaxe symétrique de littéraux de tableaux ou d'objets pour affecter des variables.</p> + +<pre class="brush: js">var toto = ["un", "deux", "trois"]; + +// sans décomposition +var un = toto[0]; +var deux = toto[1]; +var trois = toto[2]; + +// avec la décomposition +var [un, deux, trois] = toto;</pre> + +<h3 id="Opérateurs_de_comparaison">Opérateurs de comparaison</h3> + +<p>Un <a href="/fr/docs/Web/JavaScript/Reference/Opérateurs/Opérateurs_de_comparaison">opérateur de comparaison</a> compare ses deux opérandes et renvoie un valeur booléenne correspondant au résultat de la comparaison (vraie ou fausse). Les opérandes peuvent être des nombres, des chaînes de caractères, des booléens ou des objets. Les chaînes de caractères sont comparées selon l'ordre lexicographique usuel en utilisant les valeurs Unicode. Dans la plupart des cas, si les deux opérandes ne sont pas du même type, JavaScript tentera de les convertir vers un type approprié. Cette méthode aboutira souvent à une comparaison numérique. Les seules exceptions à cette conversion implicite sont les opérateurs <code>===</code> et <code>!==</code> , qui testent des égalités et inégalités strictes. Ces opérateurs n'effectuent pas de conversion de type. Le tableau qui suit décrit les opérateurs de comparaisons relativement à ce fragment de code :</p> + +<pre class="brush: js">var var1 = 3; +var var2 = 4; +</pre> + +<table class="standard-table"> + <caption>Opérateurs de comparaison</caption> + <thead> + <tr> + <th scope="col">Opérateur</th> + <th scope="col">Description</th> + <th scope="col">Exemples qui renvoient <code>true</code></th> + </tr> + </thead> + <tbody> + <tr> + <td><a href="/fr/docs/Web/JavaScript/Reference/Op%C3%A9rateurs/Op%C3%A9rateurs_de_comparaison#.C3.89galit.C3.A9_simple_(.3D.3D)">Égalité</a> (<code>==</code>)</td> + <td>Renvoie <code>true</code> si les opérandes sont égaux après conversion en valeurs de mêmes types.</td> + <td><code>3 == var1</code> + <p><code>"3" == var1</code></p> + <code>3 == '3'</code></td> + </tr> + <tr> + <td><a href="/fr/docs/Web/JavaScript/Reference/Op%C3%A9rateurs/Op%C3%A9rateurs_de_comparaison#In.C3.A9galit.C3.A9_simple_(!.3D)">Inégalité</a> (<code>!=</code>)</td> + <td>Renvoie <code>true</code> si les opérandes sont différents.</td> + <td><code>var1 != 4<br> + var2 != "3"</code></td> + </tr> + <tr> + <td><a href="/fr/docs/Web/JavaScript/Reference/Op%C3%A9rateurs/Op%C3%A9rateurs_de_comparaison#.C3.89galit.C3.A9_stricte_(.3D.3D.3D)">Égalité stricte </a>(<code>===</code>)</td> + <td>Renvoie <code>true</code> si les opérandes sont égaux et de même type. Voir {{jsxref("Object.is","Object.is()")}} et <a href="/fr/docs/JavaScript/Guide/%C3%89galit%C3%A9_en_JavaScript">égalité de type en JavaScript</a>.</td> + <td><code>3 === var1</code></td> + </tr> + <tr> + <td><a href="/fr/docs/Web/JavaScript/Reference/Op%C3%A9rateurs/Op%C3%A9rateurs_de_comparaison#In.C3.A9galit.C3.A9_stricte_(!.3D.3D)">Inégalité stricte</a> (<code>!==</code>)</td> + <td>Renvoie <code>true</code> si les opérandes ne sont pas égaux ou s'ils ne sont pas de même type.</td> + <td><code>var1 !== "3"<br> + 3 !== '3'</code></td> + </tr> + <tr> + <td><a href="/fr/docs/Web/JavaScript/Reference/Op%C3%A9rateurs/Op%C3%A9rateurs_de_comparaison#Sup.C3.A9rieur_strict_(%3E)">Supériorité stricte</a> (<code>></code>)</td> + <td>Renvoie <code>true</code> si l'opérande gauche est supérieur (strictement) à l'opérande droit.</td> + <td><code>var2 > var1<br> + "12" > 2</code></td> + </tr> + <tr> + <td><a href="/fr/docs/Web/JavaScript/Reference/Op%C3%A9rateurs/Op%C3%A9rateurs_de_comparaison#Sup.C3.A9rieur_ou_.C3.A9gal_(%3E.3D)">Supériorité ou égalité</a> (<code>>=</code>)</td> + <td>Renvoie <code>true</code> si l'opérande gauche est supérieur ou égal à l'opérande droit.</td> + <td><code>var2 >= var1<br> + var1 >= 3</code></td> + </tr> + <tr> + <td><a href="/fr/docs/Web/JavaScript/Reference/Op%C3%A9rateurs/Op%C3%A9rateurs_de_comparaison#Inf.C3.A9rieur_strict_(%3C)">Infériorité stricte</a> (<code><</code>)</td> + <td>Renvoie <code>true</code> si l'opérande gauche est inférieur (strictement) à l'opérande droit.</td> + <td><code>var1 < var2<br> + "2" < "12"</code></td> + </tr> + <tr> + <td><a href="/fr/docs/Web/JavaScript/Reference/Op%C3%A9rateurs/Op%C3%A9rateurs_de_comparaison#Inf.C3.A9rieur_ou_.C3.A9gal_(%3C.3D)">Infériorité ou égalité</a> (<code><=</code>)</td> + <td>Renvoie <code>true</code> si l'opérande gauche est inférieur ou égal à l'opérande droit.</td> + <td><code>var1 <= var2<br> + var2 <= 5</code></td> + </tr> + </tbody> +</table> + +<div class="note"> +<p><strong>Note :</strong> <code>=></code> n'est pas un opérateur. Il s'agit de la notation utilisée pour <a href="/fr/docs/Web/JavaScript/Reference/Fonctions/Fonctions_fl%C3%A9ch%C3%A9es">les fonctions fléchées</a>.</p> +</div> + +<h3 id="Opérateurs_arithmétiques">Opérateurs arithmétiques</h3> + +<p>Les <a href="/fr/docs/Web/JavaScript/Reference/Opérateurs/Opérateurs_arithmétiques">opérateurs arithmétiques</a> ont pour opérandes des valeurs numériques (des littéraux ou des variables) et renvoient une valeur numérique. Les opérateurs arithmétiques standards sont l'addition (+), la soustraction (-), la multiplication (*), et la division (/). Ces opérateurs fonctionnent comme pour la plupart des langages de programmation lorsqu'ils sont utilisés avec des nombres décimaux (on notera que la division par zéro a pour résultat {{jsxref("Infinity")}}). Ainsi :</p> + +<pre class="brush: js">1 / 2; // 0.5 +1 / 2 == 1.0 / 2.0; // true +</pre> + +<p>En plus des opérations arithmétiques standards (+,-,*,/), JavaScript fournit également d'autres opérateurs arithmétiques, listés dans le tableau qui suit :</p> + +<table class="fullwidth-table"> + <caption>Opérateurs arithmétiques</caption> + <thead> + <tr> + <th scope="col">Opérateur</th> + <th scope="col">Description</th> + <th scope="col">Exemple</th> + </tr> + </thead> + <tbody> + <tr> + <td><a href="/fr/docs/Web/JavaScript/Reference/Op%C3%A9rateurs/Op%C3%A9rateurs_arithm%C3%A9tiques#Reste_(.25)">Reste</a> (<code>%</code>)<br> + </td> + <td>Opérateur binaire. Renvoie le reste entier de la division entre les deux opérandes.</td> + <td>12 % 5 renvoie 2.</td> + </tr> + <tr> + <td><a href="/fr/docs/Web/JavaScript/Reference/Op%C3%A9rateurs/Op%C3%A9rateurs_arithm%C3%A9tiques#Incr.C3.A9ment_(.2B.2B)">Incrément</a> (<code>++</code>)</td> + <td>Opérateur unaire. Ajoute un à son opérande. S'il est utilisé en préfixe (<code>++x</code>), il renvoie la valeur de l'opérande après avoir ajouté un, s'il est utilisé comme opérateur de suffixe (<code>x++</code>), il renvoie la valeur de l'opérande avant d'ajouter un.</td> + <td>Si <code>x</code> vaut 3, <code>++x</code> incrémente <code>x</code> à 4 et renvoie 4, <code>x++</code> renvoie 3 et seulement ensuite ajoute un à <code>x</code>.</td> + </tr> + <tr> + <td><a href="/fr/docs/Web/JavaScript/Reference/Op%C3%A9rateurs/Op%C3%A9rateurs_arithm%C3%A9tiques#D.C3.A9cr.C3.A9ment_(--)">Décrément</a> (<code>--</code>)</td> + <td>Opérateur unaire. Il soustrait un à son opérande. Il fonctionne de manière analogue à l'opérateur d'incrément.</td> + <td>Si <code>x</code> vaut 3, <code>--x</code> décrémente <code>x</code> à 2 puis renvoie2, <code>x--</code> renvoie 3 puis décrémente la valeur de <code>x</code>.</td> + </tr> + <tr> + <td><a href="/fr/docs/Web/JavaScript/Reference/Op%C3%A9rateurs/Op%C3%A9rateurs_arithm%C3%A9tiques#N.C3.A9gation_unaire_(-)">Négation unaire</a> (<code>-</code>)</td> + <td>Opérateur unaire. Renvoie la valeur opposée de l'opérande.</td> + <td>Si <code>x</code> vaut 3, alors <code>-x</code> renvoie -3.</td> + </tr> + <tr> + <td><a href="/fr/docs/Web/JavaScript/Reference/Op%C3%A9rateurs/Op%C3%A9rateurs_arithm%C3%A9tiques#Plus_unaire_(.2B)">Plus unaire </a>(<code>+</code>)</td> + <td>Opérateur unaire. Si l'opérande n'est pas un nombre, il tente de le convertir en une valeur numérique.</td> + <td> + <p><code>+"3"</code> renvoie <code>3</code>.</p> + + <p><code>+true</code> renvoie <code>1</code>.</p> + </td> + </tr> + <tr> + <td><a href="/fr/docs/Web/JavaScript/Reference/Op%C3%A9rateurs/Op%C3%A9rateurs_arithm%C3%A9tiques#Exponentiation">Opérateur d'exponentiation</a> (**) (puissance) {{experimental_inline}}</td> + <td>Calcule un nombre (base) élevé à une puissance donnée (soit <code>base<sup>puissance</sup></code>)</td> + <td> + <p><code>2 ** 3</code> renvoie <code>8</code></p> + + <p><code>10 ** -1</code> renvoie <code>0.1</code></p> + </td> + </tr> + </tbody> +</table> + +<h3 id="Opérateurs_binaires">Opérateurs binaires</h3> + +<p>Les <a href="/fr/docs/Web/JavaScript/Reference/Opérateurs/Opérateurs_binaires">opérateurs binaires</a> voient leurs opérandes comme des ensembles de 32 bits (des zéros et des uns), et non pas comme des nombres décimaux, octaux ou hexadécimaux. Ainsi, le nombre décimal neuf aura une représentation binaire de 1001. Les opérateurs binaires effectuent des opérations sur des représentations binaires mais renvoies des valeurs numériques JavaScript standards.</p> + +<p>Le tableau qui suit résume les opérateurs binaires JavaScript :</p> + +<table class="standard-table"> + <caption>Opérateurs binaires</caption> + <thead> + <tr> + <th scope="col">Opérateur</th> + <th scope="col">Utilisation</th> + <th scope="col">Description</th> + </tr> + </thead> + <tbody> + <tr> + <td><a href="/fr/docs/Web/JavaScript/Reference/Op%C3%A9rateurs/Op%C3%A9rateurs_binaires#&_.28ET_binaire.29">AND (ET) binaire</a></td> + <td><code>a & b</code></td> + <td>Renvoie un 1 à chaque position binaire pour laquelle les bits des deux opérandes sont à 1.</td> + </tr> + <tr> + <td><a href="/fr/docs/Web/JavaScript/Reference/Op%C3%A9rateurs/Op%C3%A9rateurs_binaires#|_.28OU_binaire.29">OR (OU) binaire</a></td> + <td><code>a | b</code></td> + <td>Renvoie un zéro à chaque position binaire pour laquelle au moins un des bits des deux opérandes est à 0.</td> + </tr> + <tr> + <td><a href="/fr/docs/Web/JavaScript/Reference/Op%C3%A9rateurs/Op%C3%A9rateurs_binaires#.5E_.28XOR_binaire.29">XOR (OU exclusif) binaire</a></td> + <td><code>a ^ b</code></td> + <td>Renvoie un zéro à chaque position binaire pour laquelle les bits sont les mêmes (et un 1 pour chacun des bits qui est différent).</td> + </tr> + <tr> + <td><a href="/fr/docs/Web/JavaScript/Reference/Op%C3%A9rateurs/Op%C3%A9rateurs_binaires#.7E_.28NON_binaire.29">NOT (NON) binaire</a></td> + <td><code>~ a</code></td> + <td>Inverse les bits de l'opérande.</td> + </tr> + <tr> + <td><a href="/fr/docs/Web/JavaScript/Reference/Op%C3%A9rateurs/Op%C3%A9rateurs_binaires#.3C.3C_.28d.C3.A9calage_.C3.A0_gauche.29">Décalage binaire à gauche</a></td> + <td><code>a << b</code></td> + <td>Décale la représentation binaire de <code>b</code> bits sur la gauche et complète avec des zéros à droite.</td> + </tr> + <tr> + <td><a href="/fr/docs/Web/JavaScript/Reference/Op%C3%A9rateurs/Op%C3%A9rateurs_binaires#.3E.3E_.28d.C3.A9calage_.C3.A0_droite_avec_propagation_du_signe.29">Décalage binaire à droite</a></td> + <td><code>a >> b</code></td> + <td>Décale la représentation binaire de <code>b</code> bits sur la droite en ignorant les bits perdus.</td> + </tr> + <tr> + <td><a href="/fr/docs/Web/JavaScript/Reference/Op%C3%A9rateurs/Op%C3%A9rateurs_binaires#.3E.3E.3E_.28d.C3.A9calage_.C3.A0_droite_avec_insertion_de_z.C3.A9ros.29">Décalage binaire à droite en complétant avec des zéros</a></td> + <td><code>a >>> b</code></td> + <td>Décale la représentation binaire de <code>b</code> bits sur la droite en ignorant les bits perdus et ajoute des zéros sur la gauche.</td> + </tr> + </tbody> +</table> + +<h4 id="Opérateurs_binaires_logiques">Opérateurs binaires logiques</h4> + +<p>Les opérateurs binaires logiques fonctionnent de cette façon :</p> + +<ul> + <li>Les opérandes sont convertis en entiers sur 32 bits et exprimés comme une série de bits (des 1 et des 0). Les nombres sur plus de 32 bits voient leurs bits supplémentaires supprimés : + <pre class="brush: js">Avant : 11100110111110100000000000000110000000000001 +Après : 10100000000000000110000000000001</pre> + </li> + <li>Chaque bit du premier opérande est associé avec le bit correspondant du second opérande (le premier bit du premier opérande avec le premier bit du second opérande, le second avec le second et ainsi de suite)</li> + <li>L'opérateur est appliqué pour chaque paire de bits ainsi constituée et le résultat est reconstruit sous forme binaire.</li> +</ul> + +<p>Le chiffre neuf est par exemple représenté comme 1001, et le nombre quinze comme 1111. Ainsi, quand les opérateurs binaires sont appliqués sur ces valeurs, on a les résultats qui suivent :</p> + +<table class="standard-table"> + <caption>Exemples utilisant les opérateurs binaires</caption> + <thead> + <tr> + <th scope="col">Expression</th> + <th scope="col">Résultat</th> + <th scope="col">Description binaire</th> + </tr> + </thead> + <tbody> + <tr> + <td><code>15 & 9</code></td> + <td><code>9</code></td> + <td><code>1111 & 1001 = 1001</code></td> + </tr> + <tr> + <td><code>15 | 9</code></td> + <td><code>15</code></td> + <td><code>1111 | 1001 = 1111</code></td> + </tr> + <tr> + <td><code>15 ^ 9</code></td> + <td><code>6</code></td> + <td><code>1111 ^ 1001 = 0110</code></td> + </tr> + <tr> + <td><code>~15</code></td> + <td><code>-16</code></td> + <td><code>~</code><code>00000000...</code><code>00001111 = </code><code>1111</code><code>1111</code><code>...</code><code>11110000</code></td> + </tr> + <tr> + <td><code>~9</code></td> + <td><code>-10</code></td> + <td><code>~</code><code>00000000</code><code>...</code><code>0000</code><code>1001 = </code><code>1111</code><code>1111</code><code>...</code><code>1111</code><code>0110</code></td> + </tr> + </tbody> +</table> + +<p>Il faut remarquer que tous les bits sont échangés lorsque l'opérateur binaire NOT est utilisé. Il est donc utile de savoir que les valeurs dont le bit le plus fort (le plus à gauche) vaut 1 sont des nombres négatifs (représentation en complément à deux). L'évaluation de <code>~x</code> aura le même résultat que l'évaluation de <code>-x - 1</code>.</p> + +<h4 id="Opérateurs_binaires_de_décalage">Opérateurs binaires de décalage</h4> + +<p>Les opérateurs binaires de décalage utilisent deux opérandes : le premier indiquant la quantité à décaler et le second indiquant de combien de bits on décale le premier opérande. La direction du décalage est spécifiée grâce à l'opérateur.</p> + +<p>Les opérateurs binaires de décalage convertissent leurs opérandes en entiers sur 32 bits et renvoient un résultat dont le type est le même que l'opérande gauche.</p> + +<p>Les opérateurs de décalage sont énumérés dans le tableau qui suit.</p> + +<table class="fullwidth-table"> + <caption>Opérateurs binaires de décalage</caption> + <thead> + <tr> + <th scope="col">Opérateur</th> + <th scope="col">Description</th> + <th scope="col">Exemple</th> + </tr> + </thead> + <tbody> + <tr> + <td><a href="/fr/docs/Web/JavaScript/Reference/Opérateurs/Opérateurs_binaires#<<_(décalage_à_gauche)">Décalage à gauche (<code><<</code>)</a></td> + <td>Cet opérateur décale le premier opérande d'un nombre de bits donné sur la gauche. Les bits en trop sont ignorés et des bits à zéro sont introduits à droite.</td> + <td><code>9<<2</code> renvoie 36, car 1001, décalé de 2 bits à gauche, devient 100100, dont la représentation en base 10 est 36.</td> + </tr> + <tr> + <td><a href="/fr/docs/Web/JavaScript/Reference/Opérateurs/Opérateurs_binaires#>>_(décalage_à_droite_avec_propagation_du_signe)">Décalage à droite avec propagation du signe (<code>>></code>)</a></td> + <td>Cet opérateur décale le premier opérande d'un nombre de bits donné sur la droite. Les bits en trop sont ignorés et des bits correspondants au bit de signe sont introduits à gauche.</td> + <td><code>9>>2</code> renvoie 2, car 1001, décalé de 2 bits à droite, devient 10 représentant 2. De même <code>-9>>2</code> renvoie -3, car le signe est préservé.</td> + </tr> + <tr> + <td><a href="/fr/docs/Web/JavaScript/Reference/Opérateurs/Opérateurs_binaires#>>>_(décalage_à_droite_avec_insertion_de_zéros)">Décalage à droite avec zéros (<code>>>></code>)</a></td> + <td>Cet opérateur décale le premier opérande d'un nombre de bits donné sur la droite. Les bits en trop sont ignorés et des bits à 0 sont introduits à gauche.</td> + <td><code>19>>>2</code> renvoie 4, car 10011, décalé de 2 bits, devient 100 qui représente 4. Pour les nombres positifs, cet opérateur et l'opérateur précédent renvoient les mêmes résultats.</td> + </tr> + </tbody> +</table> + +<h3 id="Opérateurs_logiques">Opérateurs logiques</h3> + +<p>Les <a href="/fr/docs/Web/JavaScript/Reference/Opérateurs/Opérateurs_logiques">opérateurs logiques</a> sont généralement utilisés avec des valeurs booléennes. Dans ce cas, il renvoient une valeur booléenne. Les opérateurs <code>&&</code> et <code>||</code> renvoient en fait une valeurs d'un des opérandes et si ces opérateurs sont utilisés avec des valeurs non-booléennées, ils pourront renvoyer une valeur non-booléenne. Les opérateurs logiques sont décrits dans le tableau qui suit.</p> + +<table class="fullwidth-table"> + <caption>Opérateurs logiques</caption> + <thead> + <tr> + <th scope="col">Opérateur</th> + <th scope="col">Usage</th> + <th scope="col">Description</th> + </tr> + </thead> + <tbody> + <tr> + <td><a href="/fr/docs/Web/JavaScript/Reference/Op%C3%A9rateurs/Op%C3%A9rateurs_logiques#Logical_AND_.28&&.29">ET logique</a> (<code>&&</code>)</td> + <td><code>expr1 && expr2</code></td> + <td>Renvoie <code>expr1</code> s'il peut être converti à false, sinon renvoie <code>expr2</code>. Dans le cas où on utilise des opérandes booléens, <code>&&</code> renvoie <code>true</code> si les deux opérandes valent <code>true</code>, <code>false</code> sinon.</td> + </tr> + <tr> + <td><a href="/fr/docs/Web/JavaScript/Reference/Op%C3%A9rateurs/Op%C3%A9rateurs_logiques#OU_logique_(.7C.7C)">OU logique</a> (<code>||</code>)</td> + <td><code>expr1 || expr2</code></td> + <td>Renvoie <code>expr1</code> s'il peut être converti à <code>true</code>, sinon renvoie <code>expr2</code>. Dans le cas où on utilise des opérandes booléens, <code>||</code> renvoie <code>true</code> si l'un des opérandes vaut <code>true</code>, si les deux valent <code>false</code>, il renvoie <code>false</code>.</td> + </tr> + <tr> + <td><a href="/fr/docs/Web/JavaScript/Reference/Op%C3%A9rateurs/Op%C3%A9rateurs_logiques#Logical_NOT_.28.21.29">NON logique </a>(<code>!</code>)</td> + <td><code>!expr</code></td> + <td>Renvoie <code>false</code> si son unique opérande peut être converti en <code>true</code>, sinon il renvoie <code>true</code>.</td> + </tr> + </tbody> +</table> + +<p>Les exemples d'expressions qui peuvent être converties à <code>false</code> sont celles qui sont évaluées à <code>null</code>, 0, <code>NaN</code>, la chaîne de caractères vide (""), ou <code>undefined</code>.</p> + +<p>Le code qui suit montre des exemples de l'utilisation de l'opérateur logique ET (&&).</p> + +<pre class="brush: js">var a1 = true && true; // t && t renvoie true +var a2 = true && false; // t && f renvoie false +var a3 = false && true; // f && t renvoie false +var a4 = false && (3 == 4); // f && f renvoie false +var a5 = "Chat" && "Chien"; // t && t renvoie Chien +var a6 = false && "Chat"; // f && t renvoie false +var a7 = "Chat" && false; // t && f renvoie false +</pre> + +<p>Les exemples suivants montrent l'utilisation de l'opérateur logique OU (||).</p> + +<pre class="brush: js">var o1 = true || true; // t || t renvoie true +var o2 = false || true; // f || t renvoie true +var o3 = true || false; // t || f renvoie true +var o4 = false || (3 == 4); // f || f renvoie false +var o5 = "Chat" || "Chien"; // t || t renvoie Chat +var o6 = false || "Chat"; // f || t renvoie Chat +var o7 = "Chat" || false; // t || f renvoie Chat +</pre> + +<p>Les exemples suivants montrent l'utilisation de l'opérateur logique NON (!).</p> + +<pre class="brush: js">var n1 = !true; // !t renvoie false +var n2 = !false; // !f renvoie true +var n3 = !"Chat"; // !t renvoie false +</pre> + +<h4 id="Evaluation_rapide">Evaluation rapide</h4> + +<p>Les expressions logiques sont évaluées de gauche à droite. Cette évaluation utilise des tests pour savoir s'il est possible d'utiliser des « raccourcis » correspondant aux règles suivantes :</p> + +<ul> + <li><code>false</code> && <em>n'importe quoi</em> sera évalué à <code>false</code>.</li> + <li><code>true</code> || <em>n'importe quoi </em>sera évalué à <code>true</code>.</li> +</ul> + +<p>Les règles logiques garantissent la validité de ces évaluations, il faut noter que le second opérande n'est pas du tout évalué, empêchant ainsi les effets de bords cachés, liés à cette évaluation.</p> + +<h3 id="Opérateurs_de_chaînes_de_caractères">Opérateurs de chaînes de caractères</h3> + +<p>En plus des opérateurs de comparaisons qui peuvent être utilisés sur des chaînes de caractères, il existe l'opérateur de concaténation (+) permettant de concaténer deux chaînes de caractères. Le résultat de cette opération est la fusion des deux opérandes en une même chaîne de caractères. Ainsi :</p> + +<pre class="brush: js">console.log("ma " + "chaîne"); // affichera "ma chaîne" dans la console</pre> + +<p>L'opérateur court += peut également être utilisé pour concaténer des chaînes. Par exemple :</p> + +<pre class="brush: js">var maChaîne = "alpha"; +maChaîne += "bet"; // l'expression sera évaluée en "alphabet" + // et cette valeur sera affectée à maChaîne</pre> + +<h3 id="Opérateur_conditionnel_ternaire">Opérateur conditionnel ternaire</h3> + +<p>L'<a href="/fr/docs/Web/JavaScript/Reference/Opérateurs/L_opérateur_conditionnel">opérateur conditionnel</a> est le seul opérateur JavaScript qui utilise trois opérandes. L'expression utilisant l'opérateur peut prendre une valeur parmi deux selon une condition donnée. Cet opérateur s'utilise avec la syntaxe suivante :</p> + +<pre class="syntaxbox"><em>condition</em> ? <em>val1</em> : <em>val2</em> +</pre> + +<p>Si <code>condition</code> vaut <code>true</code>, l'opérateur vaudra <code>val1</code>. Sinon il vaudra <code>val2</code>. Il est possible d'utiliser l'opérateur conditionnel aux mêmes endroits qu'un opérateur standard.</p> + +<p>On peut par exemple avoir :</p> + +<pre class="brush: js">var statut = (âge >= 18) ? "adulte" : "mineur"; +</pre> + +<p>Cette instruction assigne la valeur "adulte" à la variable <code>status</code> si la variable <code>âge</code> est supérieure ou égale à 18. Sinon, on lui affecte la valeur "mineur".</p> + +<h3 id="La_virgule_comme_opérateur">La virgule comme opérateur</h3> + +<p>L'<a href="/fr/docs/Web/JavaScript/Reference/Opérateurs/L_opérateur_virgule">opérateur virgule</a> (<code>,</code>) évalue ses deux opérandes et renvoie la valeur du second opérande. Cet opérateur est principalement utilisé dans les boucles for pour permettre à plusieurs variables d'être modifiées à chaque itération de la boucle.</p> + +<p>Ainsi, si on a un tableau à 2 dimensions avec 10 lignes et colonnes, on peut utiliser la virgule comme opérateur pour incrémenter deux variables à la fois. Le code qui suit imprime les valeurs contenues sur la diagonale du tableau :</p> + +<pre class="brush: js">var x = [0,1,2,3,4,5,6,7,8,9] +var a = [x, x, x, x, x]; + +for (var i = 0, j = 9; i <= j; i++, j--) + console.log("a[" + i + "][" + j + "]= " + a[i][j]); +</pre> + +<h3 id="Opérateurs_unaires">Opérateurs unaires</h3> + +<h4 id="delete"><code>delete</code></h4> + +<p>L'opérateur <a href="/fr/docs/Web/JavaScript/Reference/Opérateurs/L_opérateur_delete">delete</a> supprime un objet, une propriété d'un objet ou un élément d'un tableau à partir de sa position dans le tableau. La syntaxe de cet opérateur est la suivante :</p> + +<pre class="brush: js">delete monObjet; +delete monObjet.propriété; +delete monObjet[index]; +delete propriété; // uniquement valide au sein d'une instruction with +</pre> + +<p>où on a <code>monObjet</code> qui est le nom de l'objet, <code>propriété</code> qui est une propriété existante et <code>index</code> un entier indiquant la position d'un élément dans un tableau.</p> + +<p>La quatrième instruction n'est valide qu'au sein d'une instruction <code><a href="/fr/docs/Web/JavaScript/Reference/Instructions/with">with</a></code> et permet de supprimer une propriété d'un objet.</p> + +<p>Il est possible d'utiliser l'opérateur <code>delete</code> pour supprimer les variables déclarées implicitement mais pas celles déclarées avec <code>var</code>. Si l'opérateur fonctionne correctement, il change la propriété ou l'élément vers la valeur <code>undefined</code>. L'opérateur <code>delete</code> renvoie <code>true</code> si l'opération de suppression est possible, <code>false</code> sinon.</p> + +<pre class="brush: js">x = 42; +var y = 43; +monobj = new Number(); +monobj.h = 4; // création de la propriété h +delete x; // renvoie true (suppression possible si déclaration implicite) +delete y; // renvoie false (suppression impossible si déclaration avec var si la variable n'est pas une propriété) +delete Math.PI; // renvoie false (suppression impossible pour les propriétés pré-définies) +delete monobj.h; // renvoie true (suppression possible des propriétés définies par l'utilisateur) +delete monobj; // renvoie true (suppression possible si déclaration implicite) +</pre> + +<h5 id="Suppression_déléments_dun_tableau">Suppression d'éléments d'un tableau</h5> + +<p>Lorsqu'on supprime un élément d'un tableau, la longueur du tableau n'est pas modifiée. Ainsi, si on supprime <code>a[3]</code>, <code>a[4]</code> restera <code>a[4]</code> (même position et valeur) alors que <code>a[3]</code> sera <code>undefined</code>.</p> + +<p>Lorsque l'opérateur <code>delete</code> supprime un élément d'un tableau, cet élément n'appartient plus au tableau. Dans l'exemple qui suit, <code>arbres[3]</code> est supprimé mais il est toujours accessible et renvoie <code>undefined</code>.</p> + +<pre class="brush: js">var arbres = new Array("sequoia", "laurier", "cèdre", "chêne", "érable"); +delete arbres[3]; +if (3 in arbres) { + // Ceci ne sera pas exécuté +} +</pre> + +<p>Pour qu'un élément continue à exister mais qu'il vaille <code>undefined</code>, on utilisera le mot-clé<code> undefined</code> plutôt que l'opérateur <code>delete</code>. Dans l'exemple qui suit, arbres<code>[3]</code> est modifié pour valoir <code>undefined</code> et l'élément du tableau continue à exister :</p> + +<pre class="brush: js">var arbres = new Array("sequoia", "laurier", "cèdre", "chêne", "érable"); +arbres[3] = undefined; +if (3 in arbres) { + // Ceci sera exécuté +} +</pre> + +<h4 id="typeof"><code>typeof</code></h4> + +<p>L'<a href="/fr/docs/Web/JavaScript/Reference/Op%C3%A9rateurs/L_op%C3%A9rateur_typeof">opérateur <code>typeof</code></a> peut être utilisé de deux façons distinctes :</p> + +<ol> + <li> + <pre class="syntaxbox">typeof opérande</pre> + </li> + <li> + <pre class="syntaxbox">typeof (opérande) +</pre> + </li> +</ol> + +<p>L'opérateur <code>typeof</code> renvoie une chaîne de caractères indiquant le type de l'opérande (qui n'est pas évalué). <code>opérande</code> correspond à la chaîne de caractère, la variable, le mot-clé ou l'objet dont on souhaite renvoyer le type. L'utilisation des parenthèses est facultative.</p> + +<p>Soient les définitions de variables suivantes :</p> + +<pre class="brush: js">var maFonction = new Function("5 + 2"); +var forme = "round"; +var taille = 1; +var toto = ["Pomme", "Poire", "Orange"]; +var jour = new Date(); +</pre> + +<p>L'opérateur <code>typeof</code> renverra les résultats suivants :</p> + +<pre class="brush: js">typeof maFonction; // renvoie "function" +typeof forme; // renvoie "string" +typeof taille; // renvoie "number" +typeof toto; // renvoie "object" +typeof jour; // renvoie "object" +typeof inexistant; // renvoie "undefined" +</pre> + +<p>En ce qui concerne les mots-clés <code>true</code> et <code>null</code>, l'opérateur <code>typeof</code> renvoie les résultats suivants :</p> + +<pre class="brush: js">typeof true; // renvoie "boolean" +typeof null; // renvoie "object" +</pre> + +<p>Pour une chaîne de caractères ou un nombre, <code>typeof</code> renvoie les résultats suivants :</p> + +<pre class="brush: js">typeof 62; // renvoie "number" +typeof 'Hello world'; // renvoie "string" +</pre> + +<p>L'opérateur <code>typeof</code>, lorsqu'il est utilisé avec des propriétés, renvoie le type de valeur contenue dans la propriété :</p> + +<pre class="brush: js">typeof document.lastModified; // renvoie "string" +typeof window.length; // renvoie "number" +typeof Math.LN2; // renvoie "number" +</pre> + +<p>Pour les méthodes et les fonctions, l'opérateur <code>typeof</code> renvoie les résultats suivants :</p> + +<pre class="brush: js">typeof blur; // renvoie "function" +typeof eval; // renvoie "function" +typeof parseInt; // renvoie "function" +typeof shape.split; // renvoie "function" +</pre> + +<p>Pour les objets pré-définis, l'opérateur <code>typeof</code> fonctionne ainsi :</p> + +<pre class="brush: js">typeof Date; // renvoie "function" +typeof Function; // renvoie "function" +typeof Math; // renvoie "object" +typeof Option; // renvoie "function" +typeof String; // renvoie "function" +</pre> + +<h4 id="void"><code>void</code></h4> + +<p>L'<a href="/fr/docs/Web/JavaScript/Reference/Opérateurs/L_opérateur_void">opérateur <code>void</code></a> peut être utilisé de deux façons :</p> + +<ol> + <li> + <pre class="syntaxbox">void (expression) +</pre> + </li> + <li> + <pre class="syntaxbox">void expression +</pre> + </li> +</ol> + +<p>L'opérateur <code>void</code> indique qu'une expression doit être évaluée sans retourner de valeur. <code>expression</code> étant une expression JavaScript à évaluer. Les parenthèses sont facultatives mais les utiliser permet d'avoir une meilleur lisibilité du code.</p> + +<p>L'opérateur <code>void</code> peut être utilisé pour spécifier une expression comme un lien hypertexte, l'expression est évaluée mais n'est pas chargée à la place du document actuel.</p> + +<p>Le fragment de code qui suit crée un lien hypertexte qui ne fait rien lorsque l'utilisateur clique dessus. Lorsqu'on clique sur le lien, <code>void(0)</code> est évalué à <code>undefined</code>, n'ayant aucun effet.</p> + +<pre class="brush: html"><A HREF="javascript:void(0)">Cliquer ici pour ne rien faire</A> +</pre> + +<p>Le code suivant crée un lien hypertexte qui envoie un formulaire lorsque l'utilisateur clique dessus.</p> + +<pre class="brush: html"><A HREF="javascript:void(document.form.submit())"> +Cliquer ici pour envoyer</A></pre> + +<h3 id="Opérateurs_relationnels">Opérateurs relationnels</h3> + +<p>Un opérateur relationnel compare ses opérandes et renvoie une valeur booléenne selon que le résultat de la comparaison est vrai ou faux.</p> + +<h4 id="in"><code>in</code></h4> + +<p>L'<a href="/fr/docs/Web/JavaScript/Reference/Op%C3%A9rateurs/L_op%C3%A9rateur_in">opérateur <code>in</code></a> renvoie <code>true</code> si la propriété indiquée fait partie de l'objet donné. Cet opérateur s'utilise avec la syntaxe suivante :</p> + +<pre class="syntaxbox">nomOuNumeroPropriete in monObjet +</pre> + +<p>avec <code>nomOuNumeroPropriete</code> qui est une chaîne de caractères, une expression numérique ou un symbole correspondant au nom d'une propriété ou un indice de tableau, <code>monObjet</code> est le nom d'un objet.</p> + +<p>Les exemples qui suivent utilisent cet opérateur <code>in</code>.</p> + +<pre class="brush: js">// Tableaux +var arbres = new Array("sequoia", "laurier", "cèdre", "chêne", "érable"); +0 in arbres; // renvoie true +3 in arbres; // renvoie true +6 in arbres; // renvoie false +"laurier" in arbres; // renvoie false (l'opérateur se base sur l'indice et pas + // sur la valeur) +"length" in arbres; // renvoie true (length est une propriété d'un objet Array) + +// Objets pré-définis +"PI" in Math; // renvoie true +var myString = new String("coral"); +"length" in myString; // renvoie true + +// Objets définis par l'utilisateur +var maVoiture = {fabricant: "Honda", modèle: "Accord", year: 1998}; +"fabricant" in maVoiture; // renvoie true +"modèle" in maVoiture; // renvoie true +</pre> + +<h4 id="instanceof"><code>instanceof</code></h4> + +<p>L'<a href="/fr/docs/Web/JavaScript/Reference/Opérateurs/instanceof">opérateur instanceof</a> renvoie <code>true</code> si l'objet donné est du type spécifié. Cet opérateur s'utilise avec la syntaxe suivante :</p> + +<pre class="syntaxbox">nomObjet instanceof typeObjet +</pre> + +<p>avec <code>nomObjet</code> qui est le nom de l'objet dont on souhaite comparer le type à <code>typeObjet</code>, <code>typeObjet</code> étant un type d'objet tel que {{jsxref("Date")}} ou {{jsxref("Array")}}.</p> + +<p><code>instanceof</code> peut être utilisé pour confirmer le type d'un objet pendant l'exécution. Ainsi, on peut gérer les exceptions en prévoyant différents cas pour différents types d'exception éventuellement levées.</p> + +<p>Dans l'exemple qui suit, le code utilise l'opérateur <code>instanceof</code> afin de déterminer si <code>jour</code> est un objet <code>Date</code>. C'est le cas, les instructions contenues dans le bloc après l'instruction <code>if</code> sont donc exécutées.</p> + +<pre class="brush: js">var jour = new Date(2007, 01, 22); +if (jour instanceof Date) { + // instructions à exécuter +} +</pre> + +<h3 id="Précédence_des_opérateurs">Précédence des opérateurs</h3> + +<p>La <em>précédence</em> des opérateurs indique l'ordre dans lequel ils sont appliqués lors de l'évaluation d'une expression. L'utilisation de parenthèses permet de surcharger la relation de précédence.</p> + +<p>Le tableau qui suit décrit les précédences des opérateurs, dans l'ordre décroissant.</p> + +<table class="standard-table"> + <caption>Précédence des opérateurs</caption> + <thead> + <tr> + <th scope="col">Type d'opérateur</th> + <th scope="col">Opérateurs individuels</th> + </tr> + </thead> + <tbody> + <tr> + <td>membre</td> + <td><code>. []</code></td> + </tr> + <tr> + <td>appel/création d'instance</td> + <td><code>() new</code></td> + </tr> + <tr> + <td>négation/incrémentation</td> + <td><code>! ~ - + ++ -- typeof void delete</code></td> + </tr> + <tr> + <td>multiplication/division</td> + <td><code>* / %</code></td> + </tr> + <tr> + <td>addition/soustraction</td> + <td><code>+ -</code></td> + </tr> + <tr> + <td>décalage binaire</td> + <td><code><< >> >>></code></td> + </tr> + <tr> + <td>relationnel</td> + <td><code>< <= > >= in instanceof</code></td> + </tr> + <tr> + <td>égalité</td> + <td><code>== != === !==</code></td> + </tr> + <tr> + <td>ET binaire</td> + <td><code>&</code></td> + </tr> + <tr> + <td>OU exclusif binaire</td> + <td><code>^</code></td> + </tr> + <tr> + <td>OU binaire</td> + <td><code>|</code></td> + </tr> + <tr> + <td>ET logique</td> + <td><code>&&</code></td> + </tr> + <tr> + <td>OU logique</td> + <td><code>||</code></td> + </tr> + <tr> + <td>conditionnel</td> + <td><code>?:</code></td> + </tr> + <tr> + <td>assignation</td> + <td><code>= += -= *= /= %= <<= >>= >>>= &= ^= |=</code></td> + </tr> + <tr> + <td>virgule</td> + <td><code>,</code></td> + </tr> + </tbody> +</table> + +<p>Une version plus détaillée de cette table peut être trouvée dans la <a href="/fr/docs/Web/JavaScript/Reference/Opérateurs/Précédence_des_opérateurs#Table">référence JavaScript</a>.</p> + +<h2 id="Expressions">Expressions</h2> + +<p>Un expression correspond à une unité de code valide qui est résolue en une valeur.</p> + +<p>D'un point de vue syntaxique, toute expression valide se résout en une valeur. D'un point de vue conceptuel cependant, il y a deux types d'expressions : celles avec des effets de bord (qui, par exemple, affectent une valeur à une variable) et celles qui, d'une certaine façon, sont évaluées et sont résolues en une valeur.</p> + +<p>L'expression <code>x = 7</code> affecte une valeur (premier type). Dans celle-ci, on utilise l'opérateur <code>=</code> pour affecter la valeur 7 à la variable <code>x</code>. L'expression elle-même est évaluée à 7.</p> + +<p>Le code <code>3 + 4</code> correspond au second type d'expression. On utilise ici l'opérateur <code>+</code> pour ajouter trois à quatre sans affecter le résultat (7) à une variable.</p> + +<p>Les expressions JavaScript peuvent être rangées selon différentes catégories :</p> + +<ul> + <li>Arithmétiques : l'expression est évaluée en un nombre (par exemple 3.14159)</li> + <li>Textuelles : l'expression est évaluée en une chaîne de caractères</li> + <li>Logiques : l'expression est évaluée en <code>true</code> ou <code>false</code></li> + <li>Primaires : Les mots-clés basiques et les expressions générales en JavaScript</li> + <li>Expressions vers la gauche : Les valeurs à gauche sont la cible d'une affectation</li> +</ul> + +<h3 id="Expressions_primaires">Expressions primaires</h3> + +<p>Ces expressions correspondent aux mots-clés et aux expressions générales en JavaScript.</p> + +<h4 id="this"><code>this</code></h4> + +<p>Le <a href="/fr/docs/Web/JavaScript/Reference/Opérateurs/L_opérateur_this">mot-clé <code>this</code></a> permet de faire référence à l'objet courant. En général, on l'utilise au sein d'une méthode pour faire référence à l'objet qui a utilisé la méthode. Il s'utilise de cette façon :</p> + +<pre class="syntaxbox">this["nomPropriété"] +this.nomPropriété</pre> + +<p>Soit une fonction qui valide un objet si sa propriété <code>value</code> est comprise entre deux valeurs :</p> + +<pre class="brush: js">function valide(obj, valMin, valMax){ + if ((obj.value < valMin) || (obj.value > valMax)) + console.log("Valeur incorrecte !"); +} +</pre> + +<p>Il est possible d'appeler <code>valide</code> pour chaque gestionnaire d'événement <code>onChange</code> des éléments du formulaire, et d'utiliser le mot-clé <code>this</code> pour passer l'élément même en argument :</p> + +<pre class="brush: html"><p>Entrez un nombre entre 18 et 99 :</p> +<input type="text" nom="age" size=3 onChange="valide(this, 18, 99);"> +</pre> + +<h4 id="Opérateur_de_groupement">Opérateur de groupement</h4> + +<p>L'opérateur de groupement <code>( )</code> permet de contrôler la précédence de l'évaluation dans les expressions. On peut ainsi forcer l'évaluation d'une addition avant l'évaluation d'une multiplication ou d'une division.</p> + +<pre class="brush: js">var a = 1; +var b = 2; +var c = 3; + +// précédence par défaut +a + b * c; // 7 +// ce qui correspond à : +a + (b * c); // 7 + +// on peut utiliser l'opérateur +// pour effectuer l'addition en premier +(a + b) * c; // 9 + +// ce qui équivaut à : +a * c + b * c; // 9 +</pre> + +<h3 id="Expressions_vers_la_gauche">Expressions vers la gauche</h3> + +<p>Les valeurs à gauches de ces expressions sont la cible d'une affectation.</p> + +<h4 id="new"><code>new</code></h4> + +<p>L'<a href="/fr/docs/Web/JavaScript/Reference/Opérateurs/L_opérateur_new">opérateur <code>new</code></a> permet de créer une instance d'un objet défini par l'utilisateur ou d'un objet dont le type est un des types d'objets natifs. Cet opérateur utilise la syntaxe suivante :</p> + +<pre class="brush: js">var nomObjet = new typeObjet([param1, param2, ..., paramN]); +</pre> + +<h4 id="super">super</h4> + +<p>Le <a href="/fr/docs/Web/JavaScript/Reference/Opérateurs/super">mot-clé <code>super</code></a> est utilisé afin d'appeler des fonctions disponibles sur un objet parent. Il peut notamment être utilisé avec les <a href="/fr/docs/Web/JavaScript/Reference/Classes">classes</a> pour appeler le constructeur parent.</p> + +<pre class="syntaxbox">super([arguments]); // invoque le constructeur parent +super.functionParent([arguments]); +</pre> + +<h4 id="Opérateur_de_décomposition">Opérateur de décomposition</h4> + +<p>L'<a href="/fr/docs/Web/JavaScript/Reference/Opérateurs/Opérateur_de_décomposition">opérateur de décomposition</a> permet de développer une expression là où plusieurs argument (pour les appels de fonction) ou plusieurs éléments (pour les littéraux de tableaux) sont attendus.</p> + +<p>Par exemple, si on a tableau et qu'on souhaite créer un nouveau tableau qui contient l'ancien, on peut soit utiliser une combinaison des méthodes <code>push</code>, <code>splice</code>, <code>concat</code>, soit utiliser la syntaxe de décomposition qui s'avère plus concise :</p> + +<pre class="brush: js">var parts = ['shoulders', 'knees']; +var lyrics = ['head', ...parts, 'and', 'toes'];</pre> + +<p>L'opérateur de décomposition fonctionne de façon semblable avec les appels de fonction :</p> + +<pre class="brush: js">function f(x, y, z) { } +var args = [0, 1, 2]; +f(...args);</pre> + +<p>{{PreviousNext("Web/JavaScript/Guide/Fonctions", "Web/JavaScript/Guide/Nombres_et_dates")}}</p> |