NOTION DE VARIABLES EN JAVASCRIPT

LES VARIABLES EN JAVASCRIPT

OBJECTIFS :

-                        -  Définir variable, type de variable

-         - Déclarer les variables dans un script

-         - Changer le type d’une variable dans un script

                         1-  DÉFINITION

Variable : est un espace de stockage auquel on donne un nom permettant de stoker ou enregistrer tout type de données.

            2-  LE CONCEPT DE VARIABLE 

Une variable est un objet repéré par son nom, pouvant contenir des données, qui pourront être modifiées lors de l'exécution du programme. En JavaScript, les noms de variables peuvent être aussi long que l'on désire, mais doivent répondre à certains critères :

• le nom d'une variable ne peut contenir que des caractères alphanumériques, autrement dit les lettres de A à Z et les chiffres de 0 à 9 ; l'underscore (_) et le dollar ($) sont aussi acceptés.
• un nom de variable doit commencer par une lettre (majuscule ou minuscule) ou un "_" ou  le dollard $
• un nom de variables peut comporter des lettres, des chiffres et les caractères espace et « et commercial » & ne sont pas autorisés!
• Un nom de variable ne doit pas contenir des caractere accentués.
• Les noms de variables ne peuvent pas être les noms reservés(ou mots clés) de javascript . exemples de mots clés de javascript : var, if, break, boolean, char, case.

Nom de variable correct	Nom de variable incorrect	Raison
Variable	Nom de Variable	comporte des espaces
Nom_De_Variable	123Nom_De_Variable	commence par un chiffre
nom_de_variable	toto@mailcity.com	caractère spécial @
nom_de_variable_123	Nom-de-variable	signe - interdit
_707	transient	nom réservé

                                 
                           3-DÉCLARER UNE VARIABLE

 Tout d'abord, qu'est-ce que « déclarer une variable » veut dire ? Il s'agit tout simplement de lui réserver un espace de stockage en mémoire, rien de plus. Une fois la variable déclarée, vous pouvez commencer à y stocker des données sans problème.

Les variables peuvent se déclarer de deux façons :

• soit de façon explicite :
  La commande qui permet de déclarer une variable est le mot var. Par exemple
  var Numero = 1
  var Prenom = "Luc"
• soit de façon implicite. On écrit directement le nom de la variable suivi de la valeur que l'on lui attribue et Javascript s'en accommode.

Par exemple
Numero = 1
Prenom = "Luc"

NB : Pour la clarté de votre script et votre facilité, on ne peut que conseiller d'utiliser à chaque fois le mot var pour déclarer une variable.

Le JavaScript étant un langage sensible à la casse c’est-à-dire fait la différence entre les caractères minuscules et majuscules, faites bien attention à ne pas vous tromper sur les majuscules et minuscules utilisées car, dans l'exemple suivant, nous avons bel et bien trois variables différentes déclarées :

var myVariable;

var myvariable;

var MYVARIABLE;

Le mot-clé var est présent pour indiquer que vous déclarez une variable. Une fois celle-ci déclarée, il ne vous est plus nécessaire d'utiliser ce mot-clé pour cette variable et vous pouvez y stocker ce que vous souhaitez :

                           4-  L’affectation

C’est une opération qui consiste a donner une valeur a une variable. On utilise pour cela le signe « = »

Exemple :

 Var nombre ;

 Nombre=5 ;  // on donne 5 a la variable nombre                                Le signe = sert à attribuer une valeur à la variable ; ici nous lui avons attribué le nombre 5. Quand on donne une valeur à une variable, on dit que l'on fait une affectation, car on affecte une valeur à la variable . De même, vous pouvez déclarer et assigner des variables sur une seule et même ligne :var myVariable1, myVariable2 = 4, myVariable3;

Ici, nous avons déclaré trois variables en une ligne mais seulement la deuxième s'est vu attribuer une valeur.

NB :La valeur d’une variable peut être modifier autant de fois qu’on veut.

Exercice : écrire un script qui permet de permuter les valeurs de deux variables

                 5-  LES TYPES DE VARIABLES

On distingue 03 principaux types de variables en JavaScript :

• Le type numérique (alias number) : il représente tout nombre, que ce soit un entier, un nombre négatif, scientifique, etc. Bref, c'est le type pour les nombres.

Pour assigner un type numérique à une variable, il vous suffit juste d'écrire le nombre seul :var number = 5;
Tout comme de nombreux langages, le JavaScript reconnaît plusieurs écritures pour les nombres, comme l'écriture décimale var number = 5.5;ou l'écriture scientifique var number = 3.65e+5;ou encore l'écriture hexadécimalevar number = 0x391;
Bref, il existe pas mal de façons d'écrire les valeurs numériques !

• ·  Les chaînes de caractères (alias string) : ce type représente n'importe quel texte. On peut l'assigner de deux façons différentes :

var text1 = "Mon premier texte"; // Avec des guillemets

var text2 = 'Mon deuxième texte'; // Avec des apostrophes

Il est important de préciser que si vous écrivez var myVariable = '2';alors le type de cette variable est une chaîne de caractères et non pas un type numérique.

Une autre précision importante, si vous utilisez les apostrophes pour « encadrer » votre texte et que vous souhaitez utiliser des apostrophes dans ce même texte, il vous faudra alors « échapper » vos apostrophes de cette façon :

var text = 'Ça c\'est quelque chose !';

Pourquoi ? Car si vous n'échappez pas votre apostrophe, le JavaScript croira que votre texte s'arrête à l'apostrophe contenue dans le mot « c'est ». À noter que ce problème est identique pour les guillemets.

• Les booléens (alias boolean) : un booléen est un type à deux états qui sont les suivants : vrai ou faux. Ces deux états s'écrivent de la façon suivante :

var isTrue = true;

var isFalse = false;

                   Tester l'existence de variables avec typeof

Il se peut que vous ayez un jour ou l'autre besoin de tester l'existence d'une variable ou d'en vérifier son type. Dans ce genre de situations, l'instruction typeof est très utile, voici comment l'utiliser :

var number = 2;

alert(typeof number); // Affiche : « number »

var text = 'Mon texte';

alert(typeof text); // Affiche : « string »

var aBoolean = false;

alert(typeof aBoolean); // Affiche : « boolean »

6-  LES OPÉRATEURS ARITHMÉTIQUES

Vous verrez plus tard qu'il existe plusieurs sortes d'opérateurs mais dans l'immédiat nous voulons faire des calculs, nous allons donc nous intéresser exclusivement aux opérateurs arithmétiques. Ces derniers sont à la base de tout calcul et sont au nombre de cinq.

Opérateur	Signe
addition	+
soustraction	-
multiplication	*
division	/
modulo	%

Concernant le dernier opérateur, le modulo est tout simplement le reste d'une division. Par exemple, si vous divisez 5 par 2 alors il vous reste 1, c'est le modulo !

Exercice d’application :

Ecrire un script qui permet de déterminer la surface d’un rectangle.

a)   Incrémentation (++) et décrémentation (--), opérateurs   (JavaScript)

L'opérateur d'incrémentation incrémente d'une unité la valeur d'une variable ;

a)      operateur d’incrémentation (++)

L'opérateur d'incrémentation ajoute une unité à son opérande et renvoie une valeur.

• Si l'opérateur est utilisé en suffixe (par exemple : x++), il renvoie la valeur avant l'incrémentation.
• Si l'opérateur est utilisé en préfixe (par exemple : ++x), il renvoie la valeur après l'incrémentation.

Syntaxe

Opérateur : x++ ou ++x

Exemples

// Suffixe

var x = 3;

y = x++; // y = 3, x = 4

// Préfixe

var a = 2;

b = ++a; // a = 3, b = 3

                   b)   Décrément (--)

L'opérateur de décrément soustrait une unité à son opérande et renvoie une valeur.

• Si l'opérateur est utilisé en suffixe (par exemple : x--), il renvoie la valeur avant la décrémentation.
• Si l'opérateur est utilisé en préfixe (par exemple : --x), il renvoie la valeur après la décrémentation.

Syntaxe

Opérateur : x-- ou --x

Exemples

// Suffixe

var x = 3;

y = x--; // y = 3, x = 2

// Préfixe

var a = 2;

b = --a; // a = 1, b = 1

                    c)    Opérateur concaténation(+)

Faire une concaténation c’est ajouter une chaine de caractère la fin d’une autre. Pour faire un concaténation on utilise le symbole « + ».

Exemple :

Var nom= ‘toto’ ;

 Alert(‘votre nom est :’+nom) ;// votre nom est :toto

7) BOITES DE DIALOGUE  D’AFFICHAGE ET DE LECTURE DE DONNÉES

               a)      La méthode alert()

La méthode alert() permet d'afficher dans une boîte toute simple
composée d'une fenêtre et d'un bouton OK le texte qu'on lui
fournit en paramètre. Dès que cette boîte est affichée,
l'utilisateur n'a d'autre alternative que de cliquer sur le bouton OK.

Voici sa syntaxe :

alert(nom_de_la_variable);

alert('Chaîne de caractères');

alert('Chaîne de caractères' + nom_de_la_variable);

               b)     La méthode prompt()

La méthode prompt est un peu plus évoluée que les deux précédentes
puisqu'elle fournit un moyen simple de récupérer une information provenant de
l'utilisateur, on parle alors de boîte d'invite. La méthode prompt() requiert
deux arguments :

• le texte d'invite
• la chaîne de caractères par défaut dans le champ de saisie

                  Sa syntaxe est donc la suivante :

prompt('Posez ici votre question','chaîne par défaut');

Cette boîte d'invite retourne la valeur de la chaîne saisie par l'utilisateur,

elle retourne la valeur null si jamais aucun texte n'est saisi...