Les opérateurs en JavaScript
Sommaire
Les opérateurs en JavaScript
-
Objectif
- Connaitre les différents opérateurs en JavaScript
-
Introduction
- JavaScript comporte de nombreux opérateurs selon le type de valeurs
-
Les opérateurs arithmétiques
- Les opérateurs arithmétiques utilisent des valeurs numériques (variables ou littéraux) comme opérandes et renvoient une valeur numérique.
Lorsque l'opérateur+porte sur deux opérateurs dont l'un au moins est une chaîne de caractères, il joue le rôle d'opérateur de concaténation.- L’opérateur
=affecte simplement une valeur. On le confond souvent avec l’opérateur d’égalité==. -
Les Opérateurs de comparaison
-
Les Opérateurs booléens
- Une expression de type booléen ne peut prendre que les valeurs true ou false. Ce type est notamment utilisée dans l’instruction
if. -
Les opérateurs associatifs
- Ce sont les opérateurs qui réalisent un calcul dans lequel une variable intervient des deux côtés du signe = (ce sont donc en quelque sorte également des opérateurs d’attribution).
- Ces opérateurs associent deux opérateurs d’affectation.
- C’est une forme abrégée pour noter les opérateurs de calcul.
-
Les opérateurs d’incrémentation
- Cet opérateur d’incrémentation est très utilisé pour faire varier d’une unité les compteurs implémentés dans le code.
- Ainsi pour une valeur de départ
x = 0, - Au premier passage
x++ vaut 1 (x=x + 1 ou 1=0 + 1). -
Les opérateurs de concaténation
- Utilisé avec des chaînes de caractères, cet opérateur ajoute une chaîne de caractères à la suite d’une autre chaîne de caractères.
- Lorsque vous concaténez des chaînes de caractères il ne faut pas oublier les espaces au début ou à la fin de chacune d’elles sous peine de coller les chaînes.
-
Application
-
App 01
-
Enoncé
- Créer une page HTML permettant de créer une calculatrice avec 4 opérateurs de base et d’afficher le résultat dans une zone de texte.
- Utiliser CSS3 pour ajouter un design web simulaire à l’image ci-dessous
- Colorer les boutons radio avec des couleurs différentes.
- Le schémas suivant décrit le résultat qui sera obtenu
-
Solution
- Essayez de faire l’application de votre côté avant de regarder la Solution !
-
App 02
- Utiliser trois fichiers distincts pour réliser la calculatrace représentée dans l’image suivant:
| Opérateur | Nom | Signification | Exemple |
|---|---|---|---|
| + | plus | addition | x + 100 |
| – | moins | soustraction | x – 1 |
| * | multiplié | multiplication | x*2 |
| / | divisé | division | x / 10 |
| % | modulo | reste de la division par | 356 % 5 |
| = | égal | affectation de valeur | i=4 |
| Opérateur | Nom | Signification |
|---|---|---|
| < | Inférieur | x<10 |
| <= | Inférieur ou égal | x<=10 |
| == | égal | x==10 |
| >= | Supérieur ou égal | x>=10 |
| > | Supérieur | x>10 |
| != | différent | x!=10 |
Le résultat renvoyé par une opération de comparaison est une valeur booléenne true (vrai) ou false(faux).
| Opérateur | Nom | Signification | Exemple |
|---|---|---|---|
| && | et | Les deux conditions sont vérifiées | Condition1 && Condition2 |
| || | ou | Une des deux conditions est vérifiée | Condition1 || Condition2 |
| ! | Négation | La condition n’est pas vérifiée | !Condition1 |
| Opérateur | Nom | Signification | Exemple |
|---|---|---|---|
| += | plus égal | x + = y | x= x+ y |
| -= | moins égal | x -= y | x= x- y |
| *= | multiplié égal | x*=y | x=x*y |
| /= | divisé égal | x /= y | x= x / y |
Au second passage, x++ vaut 2 (x=x +1 ou 2=1 + 1).
Au troisième passage, x++ vaut 3 (x=x +1 ou 3=2 + 1).
Et ainsi de suite.
| Opérateur | Nom | Signification | Exemple |
|---|---|---|---|
| x++ | incrémentation | x=x+1 | x++ est le même que x = x +1 |
| x- – | décrémentation | x=x-1 | x– est le même que x= x-1 |
| Opérateur | Nom | Signification | Exemple |
|---|---|---|---|
| + | concaténation | « chainel chaine2 » | « chainel » + « chaine2 » |
