Apprendre à coder sur pierre-giraud.com

DES COURS COMPLETS ET GRATUITS POUR TOUS

SOMMAIRE

Introduction

  1. Présentation du cours
  2. Introduction au JavaScript
  3. Environnement de travail

Les bases en JavaScript

  1. Où écrire le JavaScript
  2. Syntaxe et commentaires
  3. Découverte des variables
  4. Les types de valeurs
  5. Opérations sur les variables
  6. La concaténation
  7. Présentation des conditions
  8. Les conditions if, if...else, if...else if...else
  9. Opérateurs logiques
  10. Evaluation / Simplification des conditions
  11. Conditions ternaires
  12. Switch
  13. Les boucles
  14. Découverte des fonctions
  15. Test n°1

Les objets en JavaScript

  1. Définition et découverte
  2. Valeurs primitives et objets
  3. Créer des objets
  4. Les méthodes de l’objet String
  5. Les méthodes de l’objet Number
  6. Découverte de l’objet Array
  7. Les méthodes de l’objet Array
  8. Découverte de l’objet Date
  9. Les méthodes de l’objet Date
  10. L’objet Math et ses méthodes
  11. Test n°2

Notions avancées sur les fonctions

  1. La portée en JavaScript
  2. Les fonctions anonymes
  3. Les fonctions auto-invoquées
  4. Les closures JavaScript
  5. Test n°3

Le DOM HTML

  1. Découverte du DOM HTML
  2. Accéder à un élément HTML
  3. Modifier du contenu HTML
  4. Ajouter et insérer des éléments HTML
  5. Modifier ou supprimer des éléments HTML
  6. Naviguer dans le DOM
  7. Les évènements en JavaScript
  8. AddEventListener()
  9. Propagation des évènements
  10. L'objet Event
  11. Test n°4

Le BOM - Browser Object Model

  1. Le BOM et l'objet Window
  2. L'objet Screen
  3. L'objet Navigator
  4. L'objet Location
  5. L'objet History
  6. Test n°5

Les expressions régulières

  1. Découverte des regex en JavaScript
  2. Recherches et remplacements
  3. Les quantifieurs et les options
  4. Les classes de caractères et les méta-caractères
  5. Test n°6

JavaScript et formulaires

  1. Rappels sur les formulaires en HTML
  2. Validation HTML des formulaires
  3. Validation JavaScript des formulaires
  4. Test n°7

L'élément HTML canvas

  1. Découverte de l'élément canvas
  2. Dessiner des rectangles
  3. Dessiner des lignes
  4. Dessiner des arcs de cercle
  5. Créer des dégradés
  6. Insérer du texte et des images
  7. Incliner un dessin
  8. Test n°8

Notions avancées

  1. Gestion du délai d'exécution
  2. La gestion des erreurs
  3. Le mode strict
  4. Test n°9

Conclusion

  1. Conclusion - Aller plus loin

LES TYPES DE VALEURS EN JAVASCRIPT

Les types de valeurs des variables

Les variables en JavaScript peuvent stocker différents types de valeurs.

Par simplification, on parlera souvent (à tort) de « types de variables » au lieu de parler de « types de valeurs stockées par les variables ».

Les types de valeurs vont avoir une influence sur notre code, puisqu’on ne stockera pas de la même façon un chiffre ou une chaîne de caractères (un texte) par exemple dans une variable.

Nous ne pourrons pas non plus effectuer les mêmes opérations sur les variables selon le type de valeurs qu’elles stockent.

Dans cette partie, nous allons faire un tour d’horizon des types de valeurs les plus courants que peuvent stocker nos variables en JavaScript.

Le type de valeurs Number

Le type de valeurs Number va représenter tout nombre ou chiffre, qu’il soit positif, négatif, entier ou à virgule.

Pour affecter une valeur de type Number à une variable, on n’utilise ni guillemet ni apostrophe.

Faites attention : lorsque nous codons nous utilisons toujours des notations anglo-saxonnes, ce qui signifie qu’il faut remplacer nos virgules par des points pour les nombres décimaux.

Le type de valeurs Number en JavaScript

Le type de valeurs String

Le type de valeurs String va représenter les chaînes de caractères, c’est-à-dire les textes.

Si l’on veut stocker une chaîne de caractères dans une variable, il faut entourer notre chaîne par des apostrophes ou des guillemets.

Ce sont justement ces apostrophes ou guillemets qui vont indiquer au JavaScript que l’on stocke une valeur de type String.

Le type de valeurs String

Au niveau des apostrophes / guillemets, vous pouvez choisir les uns ou les autres selon votre préférence.

Cependant, si la valeur stockée contient elle même des apostrophes ou des guillemets, il faudra les échapper au moyen d’un antislash selon ce que vous aurez choisi pour entourer la valeur comme ceci :

Echapper un apostrophe ou un guillemet avec un antislash

Une nouvelle fois, comprenez bien que c’est le fait de mettre des guillemets ou des apostrophes qui va faire qu’une valeur va être considérée comme une valeur de type String.

Ainsi, même un nombre sera considéré comme étant de type String, c’est-à-dire comme une chaîne de caractères si on l’entoure de guillemets ou d’apostrophes.

Faites bien attention à cela, car ça va avoir une grande influence sur les manipulations que l’on va pouvoir faire sur telle ou telle variable !

Un nombre sera considéré comme une chaîne de caractères s’il est entouré de guillemets ou apostrophes en JavaScript

Le type de valeurs Boolean

Une variable en JavaScript peut encore stocker une valer de type Boolean, c’est-à-dire un booléen.

Un booléen, en algèbre, est une valeur binaire (soit 0, soit 1). En informatique, un booléen va être soit la valeur true (vrai), soit la valeur false (faux).

Ce type de valeur peut sembler plus compliqué à appréhender à première vue. Pas d’inquiétude, nous allons souvent l’utiliser par la suite car il va nous être très utile pour effectuer des tests et vérifier si une condition est vérifiée (true) ou non (false).

Une nouvelle fois, faites bien attention : pour qu’une variable stocke bien un booléen, il faut lui faire stocker la valeur true ou false, sans guillemets ou apostrophes.

Si vous rajoutez des guillemets ou des apostrophes, la variables stockera alors la chaîne de caractères true ou la chaîne de caractères false.

Le type de valeur booléen

Autres valeurs stockées en JavaScript

Les variables en JavaScript peuvent stocker bien d’autres valeurs n'étant pas de type String, Number ou Boolean.

Parmi les autres valeurs remarquables, on peut citer la valeur « null », qui correspond à la non connaissance à priori de la valeur ainsi que la valeur « undefined » qui correspond au fait de ne pas avoir défini de valeur pour notre variable.

Une variable peut encore contenir la valeur « NaN » qui signifie « Not a Number » (« n’est pas un nombre » en Français).

Les variables en JavaScript peuvent stocker null, undefined ou nan

Changer le type d’une valeur stockée dans une variable

Notez que vous pouvez tout à fait affecter une nouvelle valeur d’un autre type à une variable JavaScript.

La nouvelle valeur écrasera l’ancienne, tout simplement.

On peut faire stocker d’autres valeurs d’autres types à une variable

Tester le type de valeur d’une variable

Pour tester le type de la valeur que contient une variable, on utilise généralement la fonction typeof(). Nous étudierons les fonctions en détail plus tard dans ce cours.

Attention cependant, cette fonction renvoie parfois des résultats contestables sur certaines valeurs.

Voyons immédiatement un exemple d’utilisation de typeof() ensemble. Pour afficher le résultat de typeof(), nous allons l’utiliser avec une instruction alert().

Le script ci-dessous affichera tous les résultats au sein d’une même instruction alert(). Pour faire cela, j’utilise ce qu’on appelle la concaténation (avec les « + ») et la notation \n qui sert à créer un retour à la ligne en JavaScript.

Pour le moment, contentez vous de vous concentrer sur les types de variables, nous verrons une nuovelle fois le reste plus tard dans ce cours.

On affiche les types des valeurs contenues dans ons variables avec typeof()

Typeof() retourne parfois des résultats inattendus

Essayer ce code !

Sans surprise, notre variable texte est bien de type String, tandis que nos variables x et b sont respectivement de type Number et Boolean.

Le résultat renvoyé par typeof() est undefined pour notre variable u puisqu’on ne l’a pas définie.

En revanche, vous remarquez que le résultat renvoyé pour notre variable nn est Number, ce qui est très étrange sachant qu’on lui a justement donné la valeur « Not a Number ».

Enfin, notez également que typeof() renvoie Object pour notre variable n qui contient la valeur null. Ce résultat fait également débat.

Chapitre précédent

Chapitre suivant