From 8e1799d72b84ca768c044f0bc3f319cef79a2fca Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Rapha=C3=ABl=20Chalicarne?= Date: Thu, 28 May 2020 23:22:41 +1000 Subject: [PATCH] Update Nullish coalescing operator '??' --- .../12-nullish-coalescing-operator/article.md | 117 ++++++++++++++++++ .../1-loop-last-value/solution.md | 0 .../1-loop-last-value/task.md | 0 .../2-which-value-while/solution.md | 0 .../2-which-value-while/task.md | 0 .../3-which-value-for/solution.md | 0 .../3-which-value-for/task.md | 0 .../4-for-even/solution.md | 0 .../4-for-even/task.md | 0 .../5-replace-for-while/solution.md | 0 .../5-replace-for-while/task.md | 0 .../6-repeat-until-correct/solution.md | 0 .../6-repeat-until-correct/task.md | 0 .../7-list-primes/solution.md | 0 .../7-list-primes/task.md | 0 .../{12-while-for => 13-while-for}/article.md | 0 .../1-rewrite-switch-if-else/solution.md | 0 .../1-rewrite-switch-if-else/task.md | 0 .../2-rewrite-if-switch/solution.md | 0 .../2-rewrite-if-switch/task.md | 0 .../{13-switch => 14-switch}/article.md | 0 .../1-if-else-required/solution.md | 0 .../1-if-else-required/task.md | 0 .../solution.md | 0 .../2-rewrite-function-question-or/task.md | 0 .../3-min/solution.md | 0 .../3-min/task.md | 0 .../4-pow/solution.md | 0 .../4-pow/task.md | 0 .../article.md | 0 .../article.md | 0 .../1-rewrite-arrow/solution.md | 0 .../1-rewrite-arrow/task.md | 0 .../article.md | 0 .../article.md | 0 35 files changed, 117 insertions(+) create mode 100644 1-js/02-first-steps/12-nullish-coalescing-operator/article.md rename 1-js/02-first-steps/{12-while-for => 13-while-for}/1-loop-last-value/solution.md (100%) rename 1-js/02-first-steps/{12-while-for => 13-while-for}/1-loop-last-value/task.md (100%) rename 1-js/02-first-steps/{12-while-for => 13-while-for}/2-which-value-while/solution.md (100%) rename 1-js/02-first-steps/{12-while-for => 13-while-for}/2-which-value-while/task.md (100%) rename 1-js/02-first-steps/{12-while-for => 13-while-for}/3-which-value-for/solution.md (100%) rename 1-js/02-first-steps/{12-while-for => 13-while-for}/3-which-value-for/task.md (100%) rename 1-js/02-first-steps/{12-while-for => 13-while-for}/4-for-even/solution.md (100%) rename 1-js/02-first-steps/{12-while-for => 13-while-for}/4-for-even/task.md (100%) rename 1-js/02-first-steps/{12-while-for => 13-while-for}/5-replace-for-while/solution.md (100%) rename 1-js/02-first-steps/{12-while-for => 13-while-for}/5-replace-for-while/task.md (100%) rename 1-js/02-first-steps/{12-while-for => 13-while-for}/6-repeat-until-correct/solution.md (100%) rename 1-js/02-first-steps/{12-while-for => 13-while-for}/6-repeat-until-correct/task.md (100%) rename 1-js/02-first-steps/{12-while-for => 13-while-for}/7-list-primes/solution.md (100%) rename 1-js/02-first-steps/{12-while-for => 13-while-for}/7-list-primes/task.md (100%) rename 1-js/02-first-steps/{12-while-for => 13-while-for}/article.md (100%) rename 1-js/02-first-steps/{13-switch => 14-switch}/1-rewrite-switch-if-else/solution.md (100%) rename 1-js/02-first-steps/{13-switch => 14-switch}/1-rewrite-switch-if-else/task.md (100%) rename 1-js/02-first-steps/{13-switch => 14-switch}/2-rewrite-if-switch/solution.md (100%) rename 1-js/02-first-steps/{13-switch => 14-switch}/2-rewrite-if-switch/task.md (100%) rename 1-js/02-first-steps/{13-switch => 14-switch}/article.md (100%) rename 1-js/02-first-steps/{14-function-basics => 15-function-basics}/1-if-else-required/solution.md (100%) rename 1-js/02-first-steps/{14-function-basics => 15-function-basics}/1-if-else-required/task.md (100%) rename 1-js/02-first-steps/{14-function-basics => 15-function-basics}/2-rewrite-function-question-or/solution.md (100%) rename 1-js/02-first-steps/{14-function-basics => 15-function-basics}/2-rewrite-function-question-or/task.md (100%) rename 1-js/02-first-steps/{14-function-basics => 15-function-basics}/3-min/solution.md (100%) rename 1-js/02-first-steps/{14-function-basics => 15-function-basics}/3-min/task.md (100%) rename 1-js/02-first-steps/{14-function-basics => 15-function-basics}/4-pow/solution.md (100%) rename 1-js/02-first-steps/{14-function-basics => 15-function-basics}/4-pow/task.md (100%) rename 1-js/02-first-steps/{14-function-basics => 15-function-basics}/article.md (100%) rename 1-js/02-first-steps/{15-function-expressions => 16-function-expressions}/article.md (100%) rename 1-js/02-first-steps/{16-arrow-functions-basics => 17-arrow-functions-basics}/1-rewrite-arrow/solution.md (100%) rename 1-js/02-first-steps/{16-arrow-functions-basics => 17-arrow-functions-basics}/1-rewrite-arrow/task.md (100%) rename 1-js/02-first-steps/{16-arrow-functions-basics => 17-arrow-functions-basics}/article.md (100%) rename 1-js/02-first-steps/{17-javascript-specials => 18-javascript-specials}/article.md (100%) diff --git a/1-js/02-first-steps/12-nullish-coalescing-operator/article.md b/1-js/02-first-steps/12-nullish-coalescing-operator/article.md new file mode 100644 index 000000000..016ce8556 --- /dev/null +++ b/1-js/02-first-steps/12-nullish-coalescing-operator/article.md @@ -0,0 +1,117 @@ +# Opérateur de null-coalescence '??' + +[recent browser="new"] + +L'opérateur de null-coalescence `??` fournit une syntaxe courte pour sélectionner une première variable "définie" dans la liste. + +Le résultat de `a ?? b` est: +- `a` si ce n'est pas `null` ou `undefined`, +- `b`, sinon. + +Donc, `x = a ?? b` est un équivalent court de : + +```js +x = (a !== null && a !== undefined) ? a : b; +``` + +Voici un exemple plus long. + +Disons que nous avons un `firstName`, `lastName` ou `nickName`, tous facultatifs. + +Choisissons celui qui est défini et montrons-le (ou "Anonymous" si rien n'est défini) : + +```js run +let firstName = null; +let lastName = null; +let nickName = "Supercoder"; + +// Montre la première variable qui ne soit ni null, ni undefined +alert(firstName ?? lastName ?? nickName ?? "Anonymous"); // Supercoder +``` + +## Comparaison avec || + +C'est très similaire à l'opérateur OR `||`. En fait, nous pouvons remplacer `??` par `||` dans le code ci-dessus et obtenir le même résultat. + +La différence importante est que : +- `||` renvoie la première valeur *véridique*. +- `??` renvoie la première valeur *définie*. + +Cela importe beaucoup lorsque nous souhaitons traiter `null/undefined` différemment de `0`. + +Par exemple : + +```js +height = height ?? 100; +``` + +Cela définit `height` à `100` si elle n'est pas définie. Mais si `height` est `0`, il reste "tel quel". + +Comparons-le avec `||` : + +```js run +let height = 0; + +alert(height || 100); // 100 +alert(height ?? 100); // 0 +``` + +Ici, `height || 100` traite la hauteur zéro comme non définie, identique à `null`, `undefined` ou toute autre valeur falsifiée, en fonction des cas d'utilisation qui peuvent être incorrects. + +L'opération `height ?? 100` renvoie `100` uniquement si `height` est exactement `null` ou `undefined`. + +## Priorité + +La priorité de l'opérateur `??` est plutôt faible : `7` dans le [tableau MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Operator_Precedence#Table). + +C'est inférieur à la plupart des opérateurs et un peu supérieur à `=` et `?`. + +Donc, si nous devons utiliser `??` dans une expression complexe, considérez l'utilisation des parenthèses : + +```js run +let height = null; +let width = null; + +// important : utilisez des parenthèses +let area = (height ?? 100) * (width ?? 50); + +alert(area); // 5000 +``` + +Sinon, si nous omettons les parenthèses, alors `*` a la priorité la plus élevée et s'exécuterait en premier. Ce serait la même chose que : + +```js +// incorrect +let area = height ?? (100 * width) ?? 50; +``` + +Il existe également une limitation au niveau du langage. Pour des raisons de sécurité, il est interdit d'utiliser `??` avec les opérateurs `&&` et `||`. + +Le code ci-dessous déclenche une erreur de syntaxe : + +```js run +let x = 1 && 2 ?? 3; // Erreur de syntaxe +``` + +La limitation est sûrement discutable, mais pour une raison quelconque, elle a été ajoutée à la spécification du langage. + +Utilisez des parenthèses explicites pour le corriger : + +```js run +let x = (1 && 2) ?? 3; // Fonctionne +alert(x); // 2 +``` + +## Conclusion + +- L'opérateur de null-coalescence `??` fournit un moyen rapide de choisir une valeur "définie" dans une liste. + + Il est utilisé pour attribuer des valeurs par défaut aux variables : + + ```js + // Définit height=100, si height est null ou undefined + height = height ?? 100; + ``` + +- L'opérateur `??` a une très faible priorité, un peu plus élevée que `?` Et `=`. +- Il est interdit de l'utiliser avec `||` ou `&&` sans parenthèses explicites. \ No newline at end of file diff --git a/1-js/02-first-steps/12-while-for/1-loop-last-value/solution.md b/1-js/02-first-steps/13-while-for/1-loop-last-value/solution.md similarity index 100% rename from 1-js/02-first-steps/12-while-for/1-loop-last-value/solution.md rename to 1-js/02-first-steps/13-while-for/1-loop-last-value/solution.md diff --git a/1-js/02-first-steps/12-while-for/1-loop-last-value/task.md b/1-js/02-first-steps/13-while-for/1-loop-last-value/task.md similarity index 100% rename from 1-js/02-first-steps/12-while-for/1-loop-last-value/task.md rename to 1-js/02-first-steps/13-while-for/1-loop-last-value/task.md diff --git a/1-js/02-first-steps/12-while-for/2-which-value-while/solution.md b/1-js/02-first-steps/13-while-for/2-which-value-while/solution.md similarity index 100% rename from 1-js/02-first-steps/12-while-for/2-which-value-while/solution.md rename to 1-js/02-first-steps/13-while-for/2-which-value-while/solution.md diff --git a/1-js/02-first-steps/12-while-for/2-which-value-while/task.md b/1-js/02-first-steps/13-while-for/2-which-value-while/task.md similarity index 100% rename from 1-js/02-first-steps/12-while-for/2-which-value-while/task.md rename to 1-js/02-first-steps/13-while-for/2-which-value-while/task.md diff --git a/1-js/02-first-steps/12-while-for/3-which-value-for/solution.md b/1-js/02-first-steps/13-while-for/3-which-value-for/solution.md similarity index 100% rename from 1-js/02-first-steps/12-while-for/3-which-value-for/solution.md rename to 1-js/02-first-steps/13-while-for/3-which-value-for/solution.md diff --git a/1-js/02-first-steps/12-while-for/3-which-value-for/task.md b/1-js/02-first-steps/13-while-for/3-which-value-for/task.md similarity index 100% rename from 1-js/02-first-steps/12-while-for/3-which-value-for/task.md rename to 1-js/02-first-steps/13-while-for/3-which-value-for/task.md diff --git a/1-js/02-first-steps/12-while-for/4-for-even/solution.md b/1-js/02-first-steps/13-while-for/4-for-even/solution.md similarity index 100% rename from 1-js/02-first-steps/12-while-for/4-for-even/solution.md rename to 1-js/02-first-steps/13-while-for/4-for-even/solution.md diff --git a/1-js/02-first-steps/12-while-for/4-for-even/task.md b/1-js/02-first-steps/13-while-for/4-for-even/task.md similarity index 100% rename from 1-js/02-first-steps/12-while-for/4-for-even/task.md rename to 1-js/02-first-steps/13-while-for/4-for-even/task.md diff --git a/1-js/02-first-steps/12-while-for/5-replace-for-while/solution.md b/1-js/02-first-steps/13-while-for/5-replace-for-while/solution.md similarity index 100% rename from 1-js/02-first-steps/12-while-for/5-replace-for-while/solution.md rename to 1-js/02-first-steps/13-while-for/5-replace-for-while/solution.md diff --git a/1-js/02-first-steps/12-while-for/5-replace-for-while/task.md b/1-js/02-first-steps/13-while-for/5-replace-for-while/task.md similarity index 100% rename from 1-js/02-first-steps/12-while-for/5-replace-for-while/task.md rename to 1-js/02-first-steps/13-while-for/5-replace-for-while/task.md diff --git a/1-js/02-first-steps/12-while-for/6-repeat-until-correct/solution.md b/1-js/02-first-steps/13-while-for/6-repeat-until-correct/solution.md similarity index 100% rename from 1-js/02-first-steps/12-while-for/6-repeat-until-correct/solution.md rename to 1-js/02-first-steps/13-while-for/6-repeat-until-correct/solution.md diff --git a/1-js/02-first-steps/12-while-for/6-repeat-until-correct/task.md b/1-js/02-first-steps/13-while-for/6-repeat-until-correct/task.md similarity index 100% rename from 1-js/02-first-steps/12-while-for/6-repeat-until-correct/task.md rename to 1-js/02-first-steps/13-while-for/6-repeat-until-correct/task.md diff --git a/1-js/02-first-steps/12-while-for/7-list-primes/solution.md b/1-js/02-first-steps/13-while-for/7-list-primes/solution.md similarity index 100% rename from 1-js/02-first-steps/12-while-for/7-list-primes/solution.md rename to 1-js/02-first-steps/13-while-for/7-list-primes/solution.md diff --git a/1-js/02-first-steps/12-while-for/7-list-primes/task.md b/1-js/02-first-steps/13-while-for/7-list-primes/task.md similarity index 100% rename from 1-js/02-first-steps/12-while-for/7-list-primes/task.md rename to 1-js/02-first-steps/13-while-for/7-list-primes/task.md diff --git a/1-js/02-first-steps/12-while-for/article.md b/1-js/02-first-steps/13-while-for/article.md similarity index 100% rename from 1-js/02-first-steps/12-while-for/article.md rename to 1-js/02-first-steps/13-while-for/article.md diff --git a/1-js/02-first-steps/13-switch/1-rewrite-switch-if-else/solution.md b/1-js/02-first-steps/14-switch/1-rewrite-switch-if-else/solution.md similarity index 100% rename from 1-js/02-first-steps/13-switch/1-rewrite-switch-if-else/solution.md rename to 1-js/02-first-steps/14-switch/1-rewrite-switch-if-else/solution.md diff --git a/1-js/02-first-steps/13-switch/1-rewrite-switch-if-else/task.md b/1-js/02-first-steps/14-switch/1-rewrite-switch-if-else/task.md similarity index 100% rename from 1-js/02-first-steps/13-switch/1-rewrite-switch-if-else/task.md rename to 1-js/02-first-steps/14-switch/1-rewrite-switch-if-else/task.md diff --git a/1-js/02-first-steps/13-switch/2-rewrite-if-switch/solution.md b/1-js/02-first-steps/14-switch/2-rewrite-if-switch/solution.md similarity index 100% rename from 1-js/02-first-steps/13-switch/2-rewrite-if-switch/solution.md rename to 1-js/02-first-steps/14-switch/2-rewrite-if-switch/solution.md diff --git a/1-js/02-first-steps/13-switch/2-rewrite-if-switch/task.md b/1-js/02-first-steps/14-switch/2-rewrite-if-switch/task.md similarity index 100% rename from 1-js/02-first-steps/13-switch/2-rewrite-if-switch/task.md rename to 1-js/02-first-steps/14-switch/2-rewrite-if-switch/task.md diff --git a/1-js/02-first-steps/13-switch/article.md b/1-js/02-first-steps/14-switch/article.md similarity index 100% rename from 1-js/02-first-steps/13-switch/article.md rename to 1-js/02-first-steps/14-switch/article.md diff --git a/1-js/02-first-steps/14-function-basics/1-if-else-required/solution.md b/1-js/02-first-steps/15-function-basics/1-if-else-required/solution.md similarity index 100% rename from 1-js/02-first-steps/14-function-basics/1-if-else-required/solution.md rename to 1-js/02-first-steps/15-function-basics/1-if-else-required/solution.md diff --git a/1-js/02-first-steps/14-function-basics/1-if-else-required/task.md b/1-js/02-first-steps/15-function-basics/1-if-else-required/task.md similarity index 100% rename from 1-js/02-first-steps/14-function-basics/1-if-else-required/task.md rename to 1-js/02-first-steps/15-function-basics/1-if-else-required/task.md diff --git a/1-js/02-first-steps/14-function-basics/2-rewrite-function-question-or/solution.md b/1-js/02-first-steps/15-function-basics/2-rewrite-function-question-or/solution.md similarity index 100% rename from 1-js/02-first-steps/14-function-basics/2-rewrite-function-question-or/solution.md rename to 1-js/02-first-steps/15-function-basics/2-rewrite-function-question-or/solution.md diff --git a/1-js/02-first-steps/14-function-basics/2-rewrite-function-question-or/task.md b/1-js/02-first-steps/15-function-basics/2-rewrite-function-question-or/task.md similarity index 100% rename from 1-js/02-first-steps/14-function-basics/2-rewrite-function-question-or/task.md rename to 1-js/02-first-steps/15-function-basics/2-rewrite-function-question-or/task.md diff --git a/1-js/02-first-steps/14-function-basics/3-min/solution.md b/1-js/02-first-steps/15-function-basics/3-min/solution.md similarity index 100% rename from 1-js/02-first-steps/14-function-basics/3-min/solution.md rename to 1-js/02-first-steps/15-function-basics/3-min/solution.md diff --git a/1-js/02-first-steps/14-function-basics/3-min/task.md b/1-js/02-first-steps/15-function-basics/3-min/task.md similarity index 100% rename from 1-js/02-first-steps/14-function-basics/3-min/task.md rename to 1-js/02-first-steps/15-function-basics/3-min/task.md diff --git a/1-js/02-first-steps/14-function-basics/4-pow/solution.md b/1-js/02-first-steps/15-function-basics/4-pow/solution.md similarity index 100% rename from 1-js/02-first-steps/14-function-basics/4-pow/solution.md rename to 1-js/02-first-steps/15-function-basics/4-pow/solution.md diff --git a/1-js/02-first-steps/14-function-basics/4-pow/task.md b/1-js/02-first-steps/15-function-basics/4-pow/task.md similarity index 100% rename from 1-js/02-first-steps/14-function-basics/4-pow/task.md rename to 1-js/02-first-steps/15-function-basics/4-pow/task.md diff --git a/1-js/02-first-steps/14-function-basics/article.md b/1-js/02-first-steps/15-function-basics/article.md similarity index 100% rename from 1-js/02-first-steps/14-function-basics/article.md rename to 1-js/02-first-steps/15-function-basics/article.md diff --git a/1-js/02-first-steps/15-function-expressions/article.md b/1-js/02-first-steps/16-function-expressions/article.md similarity index 100% rename from 1-js/02-first-steps/15-function-expressions/article.md rename to 1-js/02-first-steps/16-function-expressions/article.md diff --git a/1-js/02-first-steps/16-arrow-functions-basics/1-rewrite-arrow/solution.md b/1-js/02-first-steps/17-arrow-functions-basics/1-rewrite-arrow/solution.md similarity index 100% rename from 1-js/02-first-steps/16-arrow-functions-basics/1-rewrite-arrow/solution.md rename to 1-js/02-first-steps/17-arrow-functions-basics/1-rewrite-arrow/solution.md diff --git a/1-js/02-first-steps/16-arrow-functions-basics/1-rewrite-arrow/task.md b/1-js/02-first-steps/17-arrow-functions-basics/1-rewrite-arrow/task.md similarity index 100% rename from 1-js/02-first-steps/16-arrow-functions-basics/1-rewrite-arrow/task.md rename to 1-js/02-first-steps/17-arrow-functions-basics/1-rewrite-arrow/task.md diff --git a/1-js/02-first-steps/16-arrow-functions-basics/article.md b/1-js/02-first-steps/17-arrow-functions-basics/article.md similarity index 100% rename from 1-js/02-first-steps/16-arrow-functions-basics/article.md rename to 1-js/02-first-steps/17-arrow-functions-basics/article.md diff --git a/1-js/02-first-steps/17-javascript-specials/article.md b/1-js/02-first-steps/18-javascript-specials/article.md similarity index 100% rename from 1-js/02-first-steps/17-javascript-specials/article.md rename to 1-js/02-first-steps/18-javascript-specials/article.md