5XINT

Apparence

Les Conditions ​

Introduction aux conditions ​

Les conditions sont un concept fondamental en programmation. Elles permettent de prendre des décisions et d'exécuter différentes parties de code en fonction de certaines conditions. Dans ce chapitre, nous allons explorer les différentes facettes des conditions et apprendre à les utiliser efficacement.

Qu'est-ce qu'une condition ? ​

Une condition est une expression qui évalue une valeur booléenne (vrai ou faux). En fonction du résultat de cette évaluation, le programme peut prendre différentes actions. Les conditions permettent de contrôler le flux d'exécution d'un programme en fonction de certaines circonstances.

Pourquoi utiliser des conditions ? ​

Les conditions sont utilisées pour rendre un programme plus flexible et réactif. Elles permettent d'effectuer des actions différentes en fonction de différentes situations. Par exemple, un programme peut afficher un message différent en fonction de l'heure de la journée, ou effectuer des calculs différents en fonction des entrées de l'utilisateur.

Les opérateurs de comparaison ​

Les opérateurs de comparaison sont utilisés pour comparer des valeurs et vérifier si une condition est vraie ou fausse. Voici les principaux opérateurs de comparaison :

Les opérateurs de comparaison numérique ​

  • L'opérateur égal (==)
  • L'opérateur différent (!=)
  • L'opérateur supérieur strict (>)
  • L'opérateur inférieur strict (<)
  • L'opérateur supérieur ou égal (>=)
  • L'opérateur inférieur ou égal (<=)

Les opérateurs de comparaison de chaînes de caractères ​

  • L'opérateur d'égalité de chaînes de caractères (===)
  • L'opérateur de différence de chaînes de caractères (!==)

Les opérateurs de comparaison logique ​

  • L'opérateur ET (&&)
  • L'opérateur OU (||)
  • L'opérateur NON (!)

Les structures de contrôle conditionnelles ​

Les structures de contrôle conditionnelles permettent d'exécuter des blocs de code en fonction du résultat d'une condition. Voici les principales structures de contrôle conditionnelles :

La structure if ​

La structure if permet d'exécuter un bloc de code si une condition est vraie. Si la condition est fausse, le bloc de code est ignoré.

javascript
if (condition) {
    // Code à exécuter si la condition est vraie
}

La structure if...else ​

La structure if...else permet d'exécuter un bloc de code si une condition est vraie, et un autre bloc de code si la condition est fausse.

javascript
if (condition) {
    // Code à exécuter si la condition est vraie
} else {
    // Code à exécuter si la condition est fausse
}

La structure if...else if...else ​

La structure if...else if...else permet d'exécuter un bloc de code parmi plusieurs blocs en fonction du résultat de différentes conditions.

javascript
if (condition1) {
    // Code à exécuter si la condition1 est vraie
} else if (condition2) {
    // Code à exécuter si la condition2 est vraie
} else {
    // Code à exécuter si aucune des conditions n'est vraie
}

Les opérateurs ternaires ​

Les opérateurs ternaires sont une forme concise d'une structure if...else. Ils permettent d'écrire une condition en une seule ligne.

javascript
condition ? expression1 : expression2;

Les opérateurs logiques ​

Les opérateurs logiques permettent de combiner plusieurs conditions pour former des expressions plus complexes. Voici les principaux opérateurs logiques :

L'opérateur ET (&&) ​

L'opérateur ET renvoie vrai si toutes les conditions sont vraies.

javascript
condition1 && condition2 && condition3;

L'opérateur OU (||) ​

L'opérateur OU renvoie vrai si au moins l'une des conditions est vraie.

javascript
condition1 || condition2 || condition3;

L'opérateur NON (!) ​

L'opérateur NON inverse le résultat d'une condition.

javascript
!condition;

Les structures de contrôle conditionnelles avancées ​

En plus des structures de contrôle conditionnelles de base, il existe d'autres structures de contrôle conditionnelles plus avancées.

La structure switch ​

La structure switch permet d'exécuter différents blocs de code en fonction de la valeur d'une expression.

javascript
switch (expression) {
    case valeur1:
        // Code à exécuter si l'expression est égale à valeur1
        break;
    case valeur2:
        // Code à exécuter si l'expression est égale à valeur2
        break;
    default:
        // Code à exécuter si aucune des valeurs ne correspond à l'expression
        break;
}

Les conditions multiples ​

Il est souvent nécessaire de vérifier plusieurs conditions en même temps. Cela peut être fait en utilisant les opérateurs logiques.

Les conditions multiples avec l'opérateur ET ​

Les conditions multiples avec l'opérateur ET permettent de vérifier si toutes les conditions sont vraies.

javascript
if (condition1 && condition2 && condition3) {
    // Code à exécuter si toutes les conditions sont vraies
}

Les conditions multiples avec l'opérateur OU ​

Les conditions multiples avec l'opérateur OU permettent de vérifier si au moins l'une des conditions est vraie.

javascript
if (condition1 || condition2 || condition3) {
    // Code à exécuter si au moins l'une des conditions est vraie
}

Les conditions imbriquées ​

Les conditions imbriquées permettent de vérifier plusieurs conditions les unes dans les autres.

Les conditions if...else imbriquées ​

Les conditions if...else imbriquées permettent de vérifier plusieurs conditions les unes après les autres.

javascript
if (condition1) {
    // Code à exécuter si la condition1 est vraie
} else if (condition2) {
    // Code à exécuter si la condition1 est fausse et la condition2 est vraie
} else {
    // Code à exécuter si aucune des conditions n'est vraie
}

Les conditions switch imbriquées ​

Les conditions switch imbriquées permettent de vérifier plusieurs valeurs les unes après les autres.

javascript
switch (expression) {
    case valeur1:
        // Code à exécuter si l'expression est égale à valeur1
        break;
    case valeur2:
        // Code à exécuter si l'expression est égale à valeur2
        switch (expression2) {
            case valeur3:
                // Code à exécuter si l'expression2 est égale à valeur3
                break;
            case valeur4:
                // Code à exécuter si l'expression2 est égale à valeur4
                break;
            default:
                // Code à exécuter si aucune des valeurs ne correspond à l'expression2
                break;
        }
        break;
    default:
        // Code à exécuter si aucune des valeurs ne correspond à l'expression
        break;
}

Les bonnes pratiques en matière de conditions ​

Lors de l'écriture de conditions, il est important de suivre quelques bonnes pratiques pour rendre votre code plus lisible et maintenable.

L'utilisation de parenthèses ​

L'utilisation de parenthèses permet de clarifier l'ordre d'évaluation des conditions.

javascript
if ((condition1 && condition2) || condition3) {
    // Code à exécuter si la condition1 et la condition2 sont vraies, ou si la condition3 est vraie
}

L'indentation du code ​

L'indentation du code permet de rendre la lecture du code plus claire et compréhensible. L'indentation consiste à ajouter des espaces ou des tabulations pour décaler visuellement le code à l'intérieur des blocs conditionnels. Cela permet de mieux visualiser la structure du code et de distinguer les différentes parties.

javascript
if (condition) {
    // Code à exécuter si la condition est vraie
    // Indentation du code à l'intérieur du bloc conditionnel
} else {
    // Code à exécuter si la condition est fausse
    // Indentation du code à l'intérieur du bloc conditionnel
}

L'utilisation de commentaires ​

L'utilisation de commentaires est une bonne pratique pour expliquer le fonctionnement des conditions et rendre le code plus compréhensible pour les autres développeurs. Les commentaires permettent d'ajouter des explications supplémentaires sur la logique derrière les conditions et d'indiquer l'objectif d'un bloc de code conditionnel.

javascript
if (condition) {
    // Code à exécuter si la condition est vraie
} else {
    // Code à exécuter si la condition est fausse
}

// Explication du bloc de code conditionnel
// Ce bloc de code vérifie si la condition est vraie et exécute le code correspondant

En suivant ces bonnes pratiques, vous pouvez améliorer la lisibilité et la maintenabilité de votre code, ce qui facilite sa compréhension et sa collaboration avec d'autres développeurs.

Exemples pratiques ​

Pour mieux comprendre l'utilisation des conditions, voici quelques exemples pratiques :

Exemple : Vérification de l'âge d'un utilisateur ​

Dans cet exemple, nous allons vérifier l'âge d'un utilisateur et afficher un message en fonction de cet âge.

javascript
const age = 25;

if (age >= 18) {
    console.log("Vous êtes majeur.");
} else {
    console.log("Vous êtes mineur.");
}

Dans ce cas, si l'âge de l'utilisateur est supérieur ou égal à 18, le message "Vous êtes majeur." sera affiché. Sinon, le message "Vous êtes mineur." sera affiché.

Exemple : Validation d'un formulaire ​

Dans cet exemple, nous allons valider les données saisies dans un formulaire en vérifiant si tous les champs obligatoires sont remplis.

javascript
const nom = "John Doe";
const email = "john.doe@example.com";
const age = 25;

if (nom !== "" && email !== "" && age !== "") {
    console.log("Formulaire validé.");
} else {
    console.log("Veuillez remplir tous les champs obligatoires.");
}

Dans ce cas, si tous les champs obligatoires sont remplis (c'est-à-dire si les variables nom, email et age ne sont pas vides), le message "Formulaire validé." sera affiché. Sinon, le message "Veuillez remplir tous les champs obligatoires." sera affiché.

Exercices ​

Exercice 1 :

javascript
const x = 10;
const y = 5;
let z = 0;

if (x > y) {
    z = x - y;
} else {
    z = y - x;
}

console.log(z);

Quelle sera la valeur de la variable z affichée à la fin de l'exécution du programme ?

Exercice 2 :

javascript
const a = 5;
const b = 10;
const c = 15;

if (a < b && b < c) {
    console.log("Condition 1");
} else if (a < b || b < c) {
    console.log("Condition 2");
} else {
    console.log("Condition 3");
}

Quel message sera affiché à la console à la fin de l'exécution du programme ?

Exercice 3 :

javascript
const score = 85;
let grade = "";

if (score >= 90) {
    grade = "A";
} else if (score >= 80) {
    grade = "B";
} else if (score >= 70) {
    grade = "C";
} else if (score >= 60) {
    grade = "D";
} else {
    grade = "F";
}

console.log(grade);

Quelle sera la valeur de la variable grade affichée à la fin de l'exécution du programme ?

Exercice 4 :

javascript
const num = 7;
let message = "";

if (num % 2 === 0) {
    message = "Le nombre est pair.";
} else {
    message = "Le nombre est impair.";
}

console.log(message);

Quel message sera affiché à la console à la fin de l'exécution du programme ?

Exercice 5 :

javascript
const age = 18;
let message = "";

if (age >= 18) {
    message = "Vous êtes majeur.";
} else {
    message = "Vous êtes mineur.";
}

if (age >= 21) {
    message += " Vous pouvez boire de l'alcool.";
}

console.log(message);

Quel message sera affiché à la console à la fin de l'exécution du programme ?

Voici une compilation de sources intéressantes sur le sujet de ce chapitre, en évitant les liens en doublon :

Sources ​

Copyright © 2023 Thibault Six