if.
Exécute un bloc de code seulement si une condition est vraie, et sinon un bloc else optionnel.
Exemple
#function grade(points) {
if (points >= 90) {
return 'excellent'
} else if (points >= 70) {
return 'bien'
} else if (points >= 50) {
return 'passable'
} else {
return 'à revoir'
}
}
console.log(grade(95))
console.log(grade(72))
console.log(grade(30))Définition et utilisation
#L’instruction if vérifie une condition entre parenthèses. Si elle est vraie, elle exécute le bloc écrit juste après. Le else optionnel contient du code pour le cas où la condition est fausse, et else if permet de vérifier d’autres conditions l’une après l’autre.
La condition n’a pas besoin d’être true ou false. JavaScript la convertit lui-même en valeur booléenne. Sont fausses (falsy) seulement : false, 0, -0, 0n, "", null, undefined et NaN. Tout le reste, y compris un tableau vide [] et un objet vide {}, compte comme vrai (truthy).
Les conditions d’une chaîne else if sont vérifiées de haut en bas, et seul le premier bloc correspondant s’exécute. Classez-les donc du plus précis au plus général.
Syntaxe
#if (condition) {
// si vrai
}
if (condition) {
// si vrai
} else {
// si faux
}
if (condition1) {
// ...
} else if (condition2) {
// ...
} else {
// ...
}Plus d’exemples
#function welcome(name) {
if (name) {
return `Bienvenue, ${name} !`
}
return 'Bienvenue, inconnu !'
}
console.log(welcome('Emma'))
console.log(welcome(''))
console.log(welcome())Une chaîne vide et undefined sont fausses, donc les deux tombent dans la seconde branche. Faites attention au nombre 0 : il est aussi faux, bien qu’il soit souvent une valeur correcte.
function buyItem(user, price) {
if (!user) {
return 'Connectez-vous'
}
if (user.coins < price) {
return 'Pas assez de pièces'
}
user.coins -= price
return `Acheté, il reste ${user.coins} pièces`
}
console.log(buyItem(null, 50))
console.log(buyItem({ coins: 30 }, 50))
console.log(buyItem({ coins: 80 }, 50))const age = 16
const hasConsent = true
if (age >= 18 || hasConsent) {
console.log('Vous pouvez rejoindre le cours')
} else {
console.log('Le consentement d’un parent est nécessaire')
}Compatibilité des navigateurs
#Largement disponible
Fonctionne dans tous les navigateurs modernes, y compris sur mobile. Vous pouvez l’utiliser sans crainte.
- Chrome
- Edge
- Firefox
- Safari
Bonnes pratiques
#- Utilisez toujours des accolades, même pour une seule instruction. L’écriture sans elles est facile à casser en ajoutant une seconde ligne, qui s’exécutera toujours.
- Au lieu de
ifprofondément imbriqués, vérifiez les cas d’erreur au début de la fonction et sortez-en immédiatement avecreturn. - Pour choisir l’une de deux valeurs, l’opérateur conditionnel
condition ? a : bsuffit, et avec plusieurs valeurs fixes,switchest souvent plus lisible.
Entrées associées
#- switchCompare une valeur à une liste de cas case et exécute le code à partir du premier qui correspond.
- ? :L’opérateur conditionnel (ternaire) renvoie l’une de deux valeurs selon une condition, en une seule expression courte.
- &&, ||, !Les opérateurs logiques ET (&&), OU (||) et NON (!). Ils combinent des conditions, et && et || renvoient l’un de leurs côtés.
- ===L’opérateur d’égalité stricte compare des valeurs sans conversion de types : true n’est obtenu que pour le même type et la même valeur.
- returnTermine l’exécution d’une fonction et transmet une valeur à l’endroit où la fonction a été appelée.
Vous voyez une erreur ou il manque un exemple ? Écrivez-nous.