Exercices NodeJS pour apprendre le JavaScript côté serveur

Objectif
Manipuler les structures conditionnelles de type if...else.

Compétences

• Utilisation des structures conditionnelles de type if...else.
• Utilisation d'expressions booléennes.
  

Cours
Algèbre de Boole
L'algèbre de Boole est utilisée en programmation pour évaluer si une expression est vraie ou fausse.

Si on prend quelques exemples basiques :
VRAI et VRAI = VRAI
VRAI et FAUX = FAUX
VRAI ou FAUX = VRAI

Si on applique ces exemples au JavaScript cela donne :

Expression booléenne
Une expression booléenne en JavaScript est une expression qui s'évalue à true ou à false.

Cela peut, par exemple, être une égalité, une inégalité, une fonction retournant une valeur booléenne...

Il est possible d'utiliser des parenthèses pour former des expressions imbriquées et forcer l'ordre de précédence (ordre d'évaluation).
Dans cet exemple, (b === 1 || b === 2) est évaluée en premier ; ce qui donne, si on détaille l'étape intermédiaire :


Algorithmique et structures conditionnelles
Une des structures de base de l'algorithmique de la plupart des langages de programmation est le branchement conditionnel de type « si », « alors », « sinon ».

En algorithmique, la syntaxe pour employer ce branchement est :
Si on traduit en mots, cela consiste à :
- évaluer l'expression  ;
- exécuter si l’évaluation donne VRAI ;

- ou exécuter dans le cas contraire.

L'instruction « sinon » n'est pas obligatoire, on peut écrire :

Code :

Sélectionner tout

1
2
si  alors 
   

Dans ce cas, on n’exécutera que si s'évalue à VRAI.

Structures conditionnelles en JavaScript
En JavaScript, les mots clés utilisés pour décrire une structure conditionnelle de ce type sont if et else:

Code javascript :

Sélectionner tout

1
2
3
4
5
6
7
var a = 0; 
  
if (a === 0) { 
    console.log('Je serai affiché !'); 
} else { 
    console.log('Je ne serai pas affiché...'); 
}

Il est bien sûr possible d'imbriquer ces structures :

Code javascript :

Sélectionner tout

1
2
3
4
5
6
7
8
9
10
11
var a = 0, b = 1; 
  
if (a === 1) { 
    console.log('Je ne serai pas affiché...'); 
} else if (a === 0) { 
    if (b === 1) { 
        console.log('Je serai affiché !'); 
    } 
} else { 
    console.log('Je ne serai pas affiché...'); 
}

Références

• L'instruction if...else
• Les opérateurs de comparaison
• L'algèbre de Boole
• L'ordre de précédence des opérateurs en JavaScript
  

Exercice
Pour ce premier exercice, il est demandé de déclarer et définir trois variables numériques.

Si elles sont égales, écrire : « Les trois variables sont identiques. »
Si seulement deux sont identiques, écrire : « deux des variables sont de valeurs égales. »
Sinon, écrire : « Les trois variables sont différentes. »

Auteur
Marc Autran

Courage !

Posez toutes vos questions à propos de cet exercice sur cette discussion du forum.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
'use strict'; 
  
var a = 2; 
var b = 2; 
var c = 2; 
  
if (a === b && b === c) { 
    console.log("Les 3 variables sont identiques.");  
} else { 
    if (b === c || a === c || a === b) { 
        console.log("2 des variables sont de valeurs égales."); 
    } else { 
        console.log("Les 3 variables sont différentes."); 
    } 
}

Objectif
Manipuler les structures conditionnelles de type switch.

Compétences

• Utilisation des structures conditionnelles de type if...else.
• Utilisation des structures conditionnelles de type switch.
• Compréhension des bases arithmétiques.

Cours
Valeur octale
La base de l'électronique est une suite de tout et de rien : le courant passe ou ne passe pas. Ce qui se traduit en informatique par le fait que le processeur travaille avec une suite de 0 (rien) et de 1 (tout). Ce qui induit que le système décimal (base 10) soit très peu utilisé quand on décrit les fonctionnements internes des ordinateurs. On lui préfère le binaire (base 2) ou l'octal (base 8), ou encore l'hexadécimal (base 16).
Pour des raisons historiques de taille d'instruction d'opcode et d'unité d'information, on utilise généralement l'octet pour définir la taille (c.-à-d. le poids) d'un fichier. L'octet est un ensemble de 8 bits, 1 bit étant un 0 ou un 1. Ce qui permet de représenter 2^8=256 (2x2x2x2x2x2x2x2) valeurs différentes dans un octet.

Pour pouvoir plus facilement lire les grands nombres d'octets, on a inventé des unités qui elles-mêmes sont fondées sur le système binaire :

• 1 Ko = 2^10 = 1024 octets (1 Kilooctet)
• 1 Mo = 2^20 = 1024 x 1024 octets (1 mégaoctet)
• 1 Go = 2^30 = 1024 x 1024 x 1024 octets (1 gigaoctet)
• 1 To = 2^40 = 1024 x 1024 x 1024 x 1024 octets (1 téraoctet)
  

C'est pour cette raison qu'un Kilooctet n'est pas égal à 1000 octets, mais 1024 octets.
À noter que certains considèrent l'appellation Ko pour 1024 octets abusive. Ils préfèrent utiliser Ko pour 1000 octets et Kio (Kibioctet) pour 1024 octets. Cependant, les OS majeurs ne font pas cette distinction.

L'équivalent utilisé pour octet en anglais est byte, mais une différence existe entre les deux. En effet, un byte ne contient pas la notion d'octal, il a donc également été employé pour des systèmes qui utilisaient des jeux d'instructions différents et où il représentait alors des structures à 7, 9 ou X bits.

Instruction switch
Dans le cas où la condition à tester dans une structure conditionnelle est la valeur d'une seule et même variable, il est plus structurant d'utiliser un switch à la place d'un if...else. Cela permet d'identifier et comprendre plus rapidement la fonction d'un code, car les possibilités conditionnelles sont restreintes.

Le code :
est équivalent à :
Le switch a d'autres spécificités qui seront vues dans de prochains exercices.

Références

• L'instruction switch
• Les bases arithmétiques
• L'octet
  

Exercice
Le but de cet exercice est de transformer une valeur binaire abrégée en sa valeur non abrégée.
Par exemple : 2K = 2048 (2 x 1024).

Nous allons utiliser trois variables :

• la première quantity représente la quantité,
• la deuxième unit représente l'unité ("K", "M", "G" ou "T"),
• la troisième result contiendra le résultat.
  

Voici un gabarit de l'exercice :

1/ Résoudre l'exercice avec une suite de if...else.
2/ Résoudre l'exercice avec un switch (avec un break pour chaque case).
3/ Faire en sorte que si la variable unit est différente des valeurs attendues ("K", "M", "G" ou "T"), la variable result soit égale à false.

Auteur
Alain Bontemps

Bonne chance !

Posez toutes vos questions à propos de cet exercice sur cette discussion du forum.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
'use strict'; 
  
var quantity = 2, 
    unit = 'K', 
    result 
; 
  
//  Résolution avec if...else. 
if (unit === 'K') { 
    result = 1024 * quantity; 
} else if (unit === 'M') { 
    result = 1024 * 1024 * quantity; 
} else if (unit === 'G') { 
    result = 1024 * 1024 * 1024 * quantity; 
} else if (unit === 'T') { 
    result = 1024 * 1024 * 1024 * 1024 * quantity; 
} else { 
    result= false; 
} 
  
console.log(result); 
  
// Résolution avec switch. 
switch (unit) { 
    case 'K': 
        result = 1024 * quantity; 
        break; 
    case 'M': 
        result = 1024 * 1024 * quantity; 
        break; 
    case 'G': 
        result = 1024 * 1024 * 1024 * quantity; 
        break; 
    case 'T': 
        result = 1024 * 1024 * 1024 * 1024 * quantity; 
        break; 
    default: 
        result = false; 
} 
  
console.log(result);

Objectif
Manipuler les structures conditionnelles de manière avancée.

Compétences

• Utilisation des structures conditionnelles.
• Utilisation avancée de l'instruction switch.
• Utilisation de la bibliothèque standard.
• Recherche d'informations dans une documentation technique.
  

Cours
Comportement avancé de l'instruction switch
L'instruction switch permet un comportement plus fin qu'une simple suite de if...else imbriqués testant l'égalité de valeur d'une seule variable, elle permet également une « traversabilité » des conditions ainsi qu'une factorisation du code exécuté en fonction des valeurs grâce à une utilisation judicieuse de l'instruction break.

Note importante : pour différencier rapidement la structure avancée du switch (instruction break en fonction des besoins), de la structure classique (instruction break systématique à la fin de chaque case), il est vivement recommandé de remplacer les instructions break volontairement omises par le commentaire //fall through, excepté lorsque la case est vide, ou encore terminée par un return ou un throw (que nous verrons dans d'autres occasions), car dans ces cas le code ne prête pas à confusion. Certains outils de programmation javascript comme ESLint renverront une erreur si vous ne respectez pas cette convention.
Pour éviter ces contraintes et les risques de confusions, certains considèrent cette structure avancée comme une mauvaise pratique et préconisent de la remplacer par une structure if/else correspondante.

Prenons pour exemple le code suivant :

• Si a = 'w', alors b = 2 (car on exécute le code du case correspondant jusqu'au premier break).
• Si a = 'x', alors b = 1 (car on exécute le code du case correspondant jusqu'au premier break).
• Si a = 'y' ou a = 'z', alors b = 1 (car on exécute le code du case correspondant jusqu'au second break, soit le premier rencontré pour ces case).
• Pour toute autre valeur de a, b sera égal à false (car on passe dans le default).
  

default est optionnel. En l'occurrence, dans notre exemple, si le cas par défaut n'était pas défini et que la valeur de b ne correspond à aucun cas du switch, b garderait sa valeur initiale définie à 0 au lieu de prendre la valeur false.

Bibliothèque standard
Dans les langages possédant un certain niveau d'abstraction (éloignés du code machine) comme JavaScript, une bibliothèque standard est généralement disponible pour aider à manipuler les chaînes de caractères, les nombres, les dates... facilement et de manière performante.

En JavaScript, ces fonctionnalités sont accessibles selon trois manières :

• Sur le scope global :
  

  Code JavaScript :

  Sélectionner tout

  isNaN(3); // Vérifie si la valeur/variable passée est un nombre ou transtypable en nombre. Renvoie false dans ce cas car 3 est bien un nombre.

• Sur un objet global (dans l'exemple suivant, l'objet global Number) :
  

  Code javascript :

  Sélectionner tout

  Number.parseInt('22K', 10); // Essaie de transformer la valeur en un entier (s'il n'y arrive pas, renvoie NaN). Renvoie un nombre égal à 22 dans ce cas.

• Sur l'objet héritant du prototype d'un objet global (dans l'exemple suivant, l'objet global String) :
  

  Code JavaScript :

  Sélectionner tout

  1
  2
  'abc'.length // Renvoie le nombre de caractères dans la chaîne de caractères; 3 dans ce cas. 
  'abc'.substr(0, 2); // Récupère une sous-chaîne de la chaîne de caractères. Renvoie 'ab' dans ce cas.

Les notions de fonction, scope, objet, méthode, prototype et héritage sont des notions importantes en JavaScript qui seront détaillées dans de futurs exercices dédiés. Leur compréhension fine n'est pas indispensable pour le moment.

Références

• L'instruction switch
• La bibliothèque standard
• La méthode substr
• La méthode toUpperCase
• La fonction parseInt
• La fonction isNaN
  

Exercice
Il s'agit dans cet exercice de comprendre et d'exploiter le comportement de l'instruction switch lorsqu'on n’utilise pas l'instruction break à la fin de chaque case. Parallèlement, nous utiliserons quelques fonctions de la bibliothèque standard du JavaScript pour nous aider. À ce propos, n'hésitez pas à consulter les références proposées ci-dessus pour mieux comprendre le fonctionnement des différentes fonctions et méthodes proposées. Cette consigne sera considérée comme implicite dans les prochains exercices. Un développeur autonome doit être capable de rechercher l'information dont il a besoin par lui même.

1/ Créer une structure de code avec un switch qui transforme une variable de type string représentant un nombre d'octets abrégé : 150K, 400M, 5G, 3T, en nombre d'octets non abrégé.
Le code devra être fonctionnel pour les unités de mesure "K", "M", "G", "T".
Si l'on n’indique pas d'unité, par exemple : var shortenBytes = '887';, on supposera que la variable testée indique des octets.

Pour rappel :

• 150K = 150 x 1024
• 400M = 400 x 1024 x 1024
• 5G = 5 x 1024 x 1024 x 1024
• 2T = 2 x 1024 x 1024 x 1024 x 1024

Voici un gabarit pour aider à démarrer l'exercice (il est possible le faire évoluer au fur et à mesure de l'énoncé) :



2/ Rendre le code insensible à la casse de sorte qu'il pourra fonctionner indifféremment avec des majuscules ou des minuscules, par exemple '250M' ou '250m', '2g' ou '2G', etc.
Pour ce faire, on utilisera la méthode toUpperCase qui permet de convertir une chaîne de caractères en majuscules.

3/ Sécuriser le script en vérifiant avec isNaN que la variable testée respecte le format attendu et peut donc être convertie en valeur numérique. Dans le cas contraire, si par exemple var shortenBytes = 'two potatoes'; et plus généralement pour toute valeur non convertible, le code devra afficher le booléen false.

Note : durant la phase de développement, ne pas hésiter à utiliser des console.log sur les variables pour vérifier que le traitement correspond au résultat attendu. Par exemple :

Auteur
Alain Bontemps

Bon boulot !

Posez toutes vos questions à propos de cet exercice sur cette discussion du forum.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
'use strict'; 
  
var shortenBytes = '150k'; 
var letter = shortenBytes.substr(shortenBytes.length - 1); // Retourne le dernier caractère 
var bytes = parseInt(shortenBytes, 10); // Convertit la chaîne de caractères '150K' en le nombre 150. 
  
// Gère le cas où shortenBytes n'est pas une valeur numérique convertissable. 
if (isNaN(bytes)) { 
    bytes = false; 
// Gère le cas où le dernier caractère de `shortenBytes` est une lettre. 
} else if (isNaN(letter)) { 
    // Teste la valeur de la lettre mise en majuscule. 
    switch (letter.toUpperCase()) { 
        case 'T': 
            bytes *= 1024; // Multiplie par 1024. 
            //fall through 
        case 'G': 
            bytes *= 1024; // Multiplie par 1024. 
            //fall through 
        case 'M': 
            bytes *= 1024; // Multiplie par 1024. 
            //fall through 
        case 'K': 
            bytes *= 1024; // Multiplie par 1024. 
            break; // Sort du switch. 
        default: 
            bytes = false; // Renvoie false si la lettre est inconnue. 
    } 
} 
  
console.log(bytes);

Objectif
Comprendre le typage dynamique.

Compétences

• Utilisation des structures conditionnelles.
• Récupération du type d'une variable.
  

Cours
Typage dynamique
Comme nous l'avons vu précédemment, en JavaScript, une variable possède un type. Cependant, contrairement à d'autres langages le type n'est pas imposé par le développeur via des définitions explicites. Ce qui induit que l'interpréteur (système qui traduit le code JavaScript en langage compréhensible par la machine) ne peut vérifier la validité des types et de leur utilisation lors de l'interprétation, mais seulement à l'exécution (quand la variable est définie).
C'est ce qu'on appelle un langage à typage dynamique. Pour ne citer que les principaux avantages et inconvénients, il est plus facile et rapide de travailler avec un typage dynamique, mais le code produit est plus difficile à déboguer et légèrement moins performant.

Récupération du type d'une variable en JavaScript
En JavaScript, il est possible de récupérer le type d'une variable grâce à l'opérateur typeof:

Notez qu'en dehors des types primitifs et des fonctions, l'opérateur typeof renvoie "object" pour tous les autres types d'objets.

Références

• Le typage dynamique
• L'opérateur typeof
  

Exercice
Déclarer et définir une variable value contenant une valeur de type nombre (number) ou chaîne de caractères (string).
Les valeurs possibles sont value = 0 ou value = 1 ou value = 2 ou value = '0' ou value = '1' ou value = '2'.

1/ À l'aide de l'instruction if...else afficher "La valeur est une chaîne de caractères" ou "La valeur est un nombre".

2/ À l'aide de l'instruction switch afficher "La valeur est supérieure à 0" et/ou "La valeur est supérieure à 1" ou "La valeur est égale à 0". Cela doit fonctionner qu'il s'agisse d'un nombre (number) ou d'une chaîne de caractères (string).

Par exemple pour var value = 2; le programme devra afficher :
Auteur
Gnuum

Bonne chance !

Posez toutes vos questions à propos de cet exercice sur cette discussion du forum.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
'use strict'; 
  
var value = 2; 
  
if (typeof value === 'string') { 
    console.log('La valeur est une chaîne de caractères'); 
} else { 
    console.log('La valeur est un nombre'); 
} 
  
switch (value) { 
    case 2: 
    case '2': 
        console.log('La valeur est supérieure à 1'); 
    case 1: 
    case '1': 
        console.log('La valeur est supérieure à 0'); 
        break; 
    default: 
        console.log('La valeur est égale à 0'); 
}

Objectif
Manipuler l'opérateur conditionnel ternaire ? :

Compétences

• Utilisation de l'opérateur conditionnel ternaire ? :

Cours
La plupart des opérateurs des langages de programmation sont unaires (1 seul opérande) ou binaires (2 opérandes). C'est notamment le cas des opérateurs arithmétiques et logiques usuels binaires comme + ou >= (x + 3, x >= y) ou unaires comme ! et - (! trouve, - y). Parmi les opérateurs unaires, on peut aussi citer typeof vu lors de l'exercice précédent (typeof hi).

L'opérateur ? : est ternaire, il nécessite 3 opérandes : une condition (expression booléenne) et deux valeurs. Il évalue l'expression booléenne et si elle est vraie renvoie la première valeur et sinon la seconde, à la manière d'un simple if...else.

Les deux codes suivants sont équivalents :

Dans l'exemple ci-dessous :


si la variable number est supérieure ou égale à 0, l'expression number >= 0 ? '+' : '-' renvoie + et sinon -. Ce résultat devient l'argument de la fonction console.log.

On peut imbriquer des conditions ternaires ou les utiliser avec des expressions plus complexes, mais dans ce cas la lisibilité devient souvent inférieure à celle d'une structure if...else.

Références

• L'opérateur conditionnel ternaire
  

Exercice
Déclarer et définir 2 variables misteryNumber et myNumber de type number.
En utilisant uniquement l'opérateur ternaire, on affiche :

• Si les 2 nombres sont égaux Congratulations !
• Sinon
  
  • Si le nombre myNumber est inférieur au nombre misteryNumber, on affiche +
  • Sinon on affiche -
    
  
  

Auteur
Marc AUTRAN

Bon courage !

Posez toutes vos questions à propos de cet exercice sur cette discussion du forum.

1
2
3
4
5
6
7
8
9
10
11
'use strict'; 
  
var misteryNumber = 5; 
var myNumber = 7; 
  
var result = misteryNumber === myNumber 
    ? 'Congratulations !' 
    : (myNumber < misteryNumber ? '+' : '-') 
; 
  
console.log(result);

1
2
3
4
5
6
7
8
9
10
'use strict'; 
  
var result = myNumber < misteryNumber 
    ? '+' 
    : '-' 
; 
result = misteryNumber === myNumber 
    ? 'Congratulations !' 
    : result 
;

1
2
3
'use strict'; 
  
var result = mysteryNumber <= myNumber ? mysteryNumber == myNumber ? 'Congratulations !' : '-' : '+';