Share on facebook
Facebook
Share on google
Google+
Share on twitter
Twitter
Share on linkedin
LinkedIn

Utiliser les variables

Ma première variable

Pour créer une variable, c’est simple, donnez un nom à la variable et affectez (=) lui une valeur. Dans l’exemple ci-dessous, ma variable nombre stocke en mémoire la valeur 2.

nombre = 2

Les variables JavaScript peuvent également contenir d’autres types de données, comme les valeurs de texte. Dans ce cas le contenu doit être délimité par des guillemets anglais ( » « ) ou des simples apostrophes (‘ ‘) ;

prenom = "David"

Quelques règles de nommage :

  • Les noms de variables doivent commencer par une lettre
  • Les noms de variables peuvent contenir des lettres, des chiffres, l’underscore _ et des signes de dollars $.
  • Ne pas utiliser les mots réservés : voir la liste
  • Les noms de variables sont sensibles à la casse (nb et NB sont des variables différentes)

Déclaration de variable

Dans les exmples ci-dessus, la déclaration de variable était implicite, le navigateur parvenait à déterminer qu’il s’agissait de variables. Mais dans certains cas, comme pour la gestion de la portée d’une variable (abordée plus tard), ou pour déclarer une variable vide qui se remplira plus tard, la déclaration de variable non implicite devient nécessaire : cette déclaration se fait avec l’opérateur let.

let nombre = 2;
let prenom;

Vous pouvez déclarer plusieurs variables dans une instruction. Il suffit de commencer avec la déclaration var et de séparer les variables par des virgules

let nombre = 2, prenom;

Ancienne déclaration avec l’opérateur var

L’opérateur var est l’ancienne déclaration d’une variable avant l’utilisation de let. Vous risquez de la rencontrer très fréquemment sur la toile.

L’opérateur var est très similaire à let mais il existe des différences subtiles: let modifie la portée d’une variable de globale à locale, dans les blocs fonction (comme pour var), mais aussi dans les blocs if() {..}ou for(){..}

if(true){
    let nb = 2; // portée locale
}
alert(nb); // erreur car la variable est inaccessible

Tandis qu’avec var le résultat serait différent

if(true){
    var nb = 2; // portée globale
}
alert(nb); // affiche 2

Même constat avec un boucle for.

for(let i=0; i<10; i++){
    ....
}
alert(i); // erreur car la variable i est inaccessible en dehors du bloc

Avec var :

for(var i=0; i<10; i++){
    ....
}
alert(i); // affiche 10

Pour conclure var limite la portée d’une variable qu’au niveau d’un bloc fonction seulement.

Récuperer la valeur d’une variable

Une valeur mise en mémoire dans une variable peut être réutilisée, tout simplement en rappelant la variable par son nom. L’instruction document.write permet d’éditer du contenu directement dans le document HTML.

Résultat visuel

Vous remarquez dans l’exemple que la valeur « daniel » est rappelé par la variable prenom

Copier une variable

Pour créer une copie d’une variable déjà existante, il suffit d’affecter la nouvelle variable à l’original

let nombre = 2
let copieDeNombre = nombre;

Note : ceci n’est vrai que pour les variables de type primitif (booléen, nombre ou chaine de caractère). Dans le cas contraire (objet, tableau), la variable n’est pas dupliquée en mémoire, on obtient simplement une seconde référence qui pointe vers la même variable (en d’autres termes on créé un pointeur)

Voir les autres tutoriels au sujet des bases

Présentation– Intégration– Les variables– Les types– Les tableaux– Opérateurs d’assignation– Opérateurs de comparaison– Opérateurs arithmetiques– Opérateurs logiques– La concaténation– Les conditionsLes boucles d’instructions– Les blocs d’instructions– Les fonctions prédéfinies

A lire aussi

tutowebdesign

Afficher du contenu au scroll

Afficher du contenu au scroll Voici un effet impressionnant et pourtant très facile à mettre en place sur vos pages. Le principe consiste à faire

Lire »
tutowebdesign

Créer un menu latéral animé

Créer un menu latéral animé Idéal pour les formats mobiles, voici un menu latéral animé facile à faire dont l’ouverture est déclenchée par Javascript. Commençons

Lire »
MegaphoNews - Closer Than Ever

The leading news agency comes to your smartphone.  Download now.

Politique d'utilisation des cookies

En poursuivant votre navigation sur ce site, vous acceptez l’utilisation de cookies. Les cookies nous permettent de personnaliser le contenu, les sorties et d’optimiser notre trafic.