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.

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 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

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).

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.

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

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.

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

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).
  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

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.

Opérateur	Nom	Signification	Exemple
+	concaténation	"chainel chaine2"	"chainel" + "chaine2"

Application

1. 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 !

2. App 02

   • Utiliser trois fichiers distincts pour réliser la calculatrace représentée dans l'image suivant: