Faire le quiz close

Les variables en JavaScript

#1 Déclarer une variable open

Pour déclarer une variable, il faut impérativement utiliser le mot réservé var, ensuite donner un nom à la variable, puis lui affecter une valeur.

Au moment de l'affectation, la variable est allouée en mémoire dans un emplacement dont la taille dépend du type de la valeur. La valeur est rangée dans cet emplacement. On peut dire que la variable reçoit la valeur et prend le type de la valeur.

Pour voir le type de la variable, on dispose de l'opérateur typeof.

  1. Prenez Sublime Text et créez un fichier sur le bureau que vous appelez variables.html.
  2. Glisser/Déposer ce fichier dans Chrome, puis ouvrez la console JavaScript et détacher la pour la mettre sur une moitié d'écran.
  3. Tapez !>script puis tab.
  4. Tapez var x = 1 ;.
  5. Maintenant pour voir le type de la variable, tapez typeof(x) ou bien typeof x, et vous mettez ça dans un console.log();
  6. Allez dans Chrome et tapez F5.

Dans la console, vous devez voir s'afficher number, qui est le type de la variable x. Ce qui s'affiche dans la console, c'est la chaîne de caractères qui est renvoyée par typeof.

#2 Quelques cas particuliers ou erreurs open

Vous oubliez de déclarer la variable

  1. Prenez Sublime Text, supprimez la ligne qui contient la déclaration de la variable.
  2. Faites F5 et vous constatez qu'une erreur est déclenchée. Vous vous rendez compte, que vous êtes prévenu si vous utilisez une variable, qui n'est pas déclarée. C'est déjà ça !

Vous oubliez le mot réservé var

  1. Prenez Sublime Text, faites plusieurs CTRL+Z, supprimez juste le var de la ligne qui contient la déclaration.
  2. Faites F5 et vous constatez qu'apparemment tout va bien.

Si vous oubliez le mot réservé var, l'interpréteur JavaScript alloue quand même la variable, et ne vous dit rien. La conséquence est importante, car dans ce cas, la variable est considérée comme une variable globale. A ce titre, elle sera visible dans tous les codes JavaScript qui sont inclus dans la page html. Il y a donc un risque de conflit avec une autre variable qui porte le même nom...C'est la cause de nombreux bugs. C'est assez difficile à voir.

Vous oubliez d'affecter la variable

  1. Prenez Sublime Text, faites plusieurs CTRL+Z, supprimez l'affectation et le typeof.
  2. Faites F5 et vous constatez que le console.log affiche undefined. Il s'agit d'une valeur particulière, qu'il faut connaître, et qu'il peut être utile de tester.
  3. Avec Sublime Text, tapez if, cherchez le if seul puis tapez tab.
  4. Tapez x === undefined, puis tab, puis console.log('Non définie').
  5. Faites F5, et vous constatez l'affichage de Non définie.

Ici avec l'opérateur ===, nous avons testé que x était égal et de même type que undefined.

Vous affectez plusieurs fois la variable avec des valeurs de type différent.

  1. Prenez Sublime Text, faites plusieurs CTRL+Z et corrigez pour revenir à la déclaration initiale de x.
  2. Maintenant, affectez la chaîne de caractères 'Bonjour' à x.
  3. Faites un typeof
  4. Vous constatez que le type de la variable a changé.

On dit que le langage JavaScript est un langage à typage dynamique, car le type d'une variable peut évoluer en cours d'exécution, ce qui sous entend que l'espace mémoire alloué à la variable peut évoluer en cours d'exécution.

En JavaScript, vous serez obligé de faire attention à ne pas perdre de vue le type de vos variables et pour cela, vous utiliserez souvent l'opérateur typeof.

N'oubliez pas que du type de la variable dépend les opérations qui sont disponibles pour ce type. Vous pouvez multiplier ou diviser x lorsque c'est un number. Vous ne pouvez plus le faire lorsque c'est devenu une chaîne de caractères.

Vous pouvez déclarer plusieurs variables en une seule déclaration. Un seul var suffit.

Si vous avez beaucoup de variables à déclarer, vous pouvez le faire en une seule déclaration :

  1. Prenez Sublime Text et tapez le code suivant.
  2. Vérifiez les affichages.

#3 Les règles de nommage open

Ces règles de nommage sont celles à utiliser pour tous les identificateurs : noms de variables, noms de fonctions, noms d'objets, noms de propriétés...

Pour donner un nom à une variable, vous pouvez utiliser les caractères suivants :

  • les lettres minuscules de a à z.
  • les majuscules de A à Z.
  • les nombres entiers.
  • l'underscore ( tiret bas : _ ) ET le dollar ($).

Attention !

  1. Vous ne devez pas mettre d'espace, pas d'accent.
  2. Vous ne devez pas commencer par un nombre.
  3. JavaScript est case sensitive. Autrement dit, lettres minuscules et majuscules ne sont pas équivalentes.

Simplifiez vous la vie. Il existe un usage pour donner un nom à une variable qui consiste à écrire le premier mot en le commençant avec une minuscule et les mots suivants en les commençant avec une majuscule. Par exemple var uneVariableEntiere.

#4 Les valeurs des variables open

On parle ici des valeurs que l'on peut affecter aux variables. On dit aussi les valeurs littérales ou littéraux. On va étudier les nombres, les chaînes, les booléens.

Les nombres

Les variables JavaScript affectées avec un nombre reçoivent le type number. JavaScript ne fait pas de différence au niveau du type, entre une variable qui contient un entier, et une variable qui contient un chiffre décimal.

Les nombres entiers peuvent être exprimés en octal et en hexadécimal. Et bien sûr, les opérateurs savent travailler dans ces bases.

Les chaînes de caractères

Les variables JavaScript affectées avec une chaîne de caractères reçoivent le type string.

Les chaînes de caractères peuvent être délimitées :

  • par une paire de simple quote ' (en dessous de la touche du chiffre 4)
  • par une paire de double quote " (en dessous de la touche du chiffre 3)

Vous pouvez avoir besoin de mettre une simple quote dans une chaîne entre simple quote. Dans ce cas, il faut mettre le caractère backslashes \ devant, pour annuler la signification du caractère qui suit. On appelle ça "échapper" le caractère.

Pareil pour un caractère double quote dans une chaîne entre double quote.

Cependant, vous n'avez pas besoin d'échapper la simple quote dans une chaîne entre double quote.

Vous pouvez avoir besoin de mettre des tabulations ou des retours à la ligne dans une chaîne.

alert() ne voit pas les tab alors que console.log() oui

Les booléens

Une variable booléenne prend soit la valeur true (vraie) soit la valeur false (faux).

Par exemple, on peut imaginer que la variable est_inscrit pour un utilisateur vaut, true s'il est inscrit, et false s'il ne l'est pas.

Les autres valeurs qui peuvent être affectées à une variable

Vous pouvez affecter une fonction ou un objet à une variable. On le verra dans les tutoriels dédiés aux fonctions et objets.

On remarque que les tableaux ne sont pas cités. En fait ce sont des objets.

Six types de base à connaître

Les six types de base qui sont les six types détectés par l'opérateur typeof.

  1. number
  2. string
  3. boolean
  4. object
  5. function
  6. undefined

#5 La portée des variables open

Il faut savoir que selon l'endroit où elle est déclarée, une variable n'est pas visible dans tout le code JavaScript. Elle peut être visible seulement dans une partie du code. C'est ce que l'on appelle la portée.