5 - Le développement 5.4 - La programmation

Chapitre 5.4.4Les conditions

Si ceci est vrai, fais ci, sinon, fais ça.
Temps de lecture : 5 minutes

Un programme qui fait toujours la même chose, quel que soit le contexte, n'a pas beaucoup d'intérêt. La puissance de la programmation, c'est de pouvoir adapter le comportement en fonction des données. C'est le rôle des conditions.

Si, sinon

Le principe est simple : si une condition est vraie, on exécute un bloc de code. Sinon, on en exécute un autre. Les mots-clés sont if (si) et else (sinon).

Dans la console de ton navigateur
let age = 20

if (age >= 18) {
    console.log("Tu es majeur")
} else {
    console.log("Tu es mineur")
}

On peut enchainer les conditions avec else if (sinon si) :

Plusieurs conditions
let note = 14

if (note >= 16) {
    console.log("Mention Bien")
} else if (note >= 14) {
    console.log("Mention Assez Bien")
} else if (note >= 10) {
    console.log("Admis")
} else {
    console.log("Recalé")
}

Les opérateurs de comparaison

Pour construire une condition, on compare des valeurs entre elles. Voici les opérateurs les plus courants :

  • === : est strictement égal à.
  • !== : est strictement différent de.
  • < et > : inférieur / supérieur.
  • <= et >= : inférieur ou égal / supérieur ou égal.
Comparaisons
console.log(5 === 5)    // true
console.log(5 === "5")  // false (un nombre n'est pas un texte)
console.log(3 !== 4)    // true
console.log(10 > 7)     // true

En JavaScript, il existe aussi == (avec deux signes égal). Cet opérateur tente de convertir les types avant de comparer : 5 == "5" donne true. C'est une source de bugs énorme. Utilise toujours === (trois signes égal), qui compare la valeur et le type.

Les opérateurs logiques

Les conditions peuvent se combiner entre elles grâce aux opérateurs logiques :

ET (&&)

Les deux parties doivent être vraies pour que l'ensemble soit vrai.

Opérateur ET
let age = 25
let aLePermis = true

if (age >= 18 && aLePermis) {
    console.log("Tu peux conduire")
}

OU (||)

Une seule des parties a besoin d'être vraie pour que l'ensemble soit vrai.

Opérateur OU
let jour = "samedi"

if (jour === "samedi" || jour === "dimanche") {
    console.log("C'est le week-end !")
}

NON (!)

Inverse le résultat : ce qui était vrai devient faux, et inversement.

Opérateur NON
let estConnecte = false

if (!estConnecte) {
    console.log("Connecte-toi d'abord")
}

Un piège subtil du ET et du OU : ils s'évaluent de gauche à droite et s'arrêtent dès que le résultat est déterminé. Avec un ET, si la première partie est fausse, la seconde n'est même pas exécutée (puisque le résultat sera forcément faux). Avec un OU, si la première partie est vraie, la seconde est ignorée.

Ça a l'air anodin, mais si la seconde partie contient une action (un appel de fonction, par exemple), cette action ne sera pas déclenchée. C'est une source de bugs vicieux.

L'algèbre de Boole

Dans le chapitre sur les types, on a vu le booléen : vrai ou faux. Ce nom vient du mathématicien George Boole, qui a formalisé au 19e siècle les règles de logique sur lesquelles repose toute l'informatique moderne.

Quelques propriétés utiles au quotidien :

  • Double négation : le contraire du contraire de "il fait beau", c'est "il fait beau".
  • Commutativité : "il fait beau ET chaud" revient au même que "il fait chaud ET beau".

Un autre mathématicien, De Morgan, a formalisé des lois qui aident les développeurs à simplifier des conditions complexes :

  • NON(A ET B) = NON(A) OU NON(B)
  • NON(A OU B) = NON(A) ET NON(B)

Exemple :

L'inverse de "je suis développeur web ET freelance" revient à : soit je ne suis pas développeur web, soit je ne suis pas freelance (ou les deux). L'inverse de "je bois du café OU du thé" revient à : je ne bois ni café, ni thé.

C'est évident avec des petits exemples, mais c'est parfois un vrai casse-tête sur des cas métier complexes avec cinq ou six conditions imbriquées. Les développeurs passent une bonne partie de leur temps à réorganiser et simplifier ces conditions pour que le code reste lisible.

Vrai ou faux : les valeurs "truthy" et "falsy"

En JavaScript, les conditions ne manipulent pas que des booléens. N'importe quelle valeur peut être évaluée comme "vraie" ou "fausse". La règle est simple : tout ce qui n'est pas "faux" est considéré comme "vrai".

Les valeurs considérées comme fausses : false, 0, "" (texte vide), null, undefined.

Tout le reste est considéré comme vrai. On profite de ce mécanisme pour tester l'existence de quelque chose :

Truthy et falsy
let panier = []

if (panier.length) {
    console.log("Il y a des articles dans le panier")
} else {
    console.log("Le panier est vide")
}

Ici, panier.length vaut 0 (le tableau est vide), et 0 est considéré comme faux. Pas besoin d'écrire panier.length > 0, même si c'est plus explicite et souvent recommandé.

Les conditions révèlent tout leur potentiel une fois associées aux boucles, l'autre grande brique des algorithmes, qui font l'objet du chapitre suivant.