Quand devrais-je utiliser ?? (coalescence nullish) vs || (logique ou)?

Question

Liée à Y a-t-il un opérateur "NULL COALESSCING" en JavaScript? - JavaScript a maintenant un ?? L'opérateur que je vois est utilisé plus fréquemment. Auparavant, la plupart du code JavaScript utilisé ||.

let userAge = null

// These values will be the same. 
let age1 = userAge || 21
let age2 = userAge ?? 21

Dans quelles circonstances ?? et || se comporter différemment?

Answer 1

Base sur mdn docs :

Contrairement à le logique OR (||) Opérateur , l'opérande gauche est renvoyé s'il s'agit d'un Falsy valeur qui est non null ou undefined.

Exemple conceptuel:

• Lorsque vous utilisez || Pour a FALSY valeur qui est [~ # ~ # ~] non [~ # ~] undefined ou `null:

  false || 'name'; // ==> the 'name' is returned
  

• Mais lorsque vous utilisez ?? Pour le cas ci-dessus:

  false ?? 'name'; // ==> the false is returned
  
  

Exemple réel : suppose, nous avons une variable phone qui n'est pas obligatoire dans notre formulaire et la chaîne vide ('') est valable pour nous et que nous voulons doSomething() si la variable phone _ est null ou undefined, devine maintenant quoi:

• Lorsque vous utilisez || Pour a FALSY valeur qui est [~ # ~ # ~] non [~ # ~] undefined ou `null:

  const phone = ''; // assume it became empty string from some action
  
  phone || doSomething(); // ==> damn, the doSomething is run but we want to run it if it's `undefined` or `null` the empty string is valid for us
  

• Mais lorsque vous utilisez ?? Pour le cas ci-dessus:

  const phone = ''; // same assumption like above
  
  phone || doSomething(); // ==> yeah, that's right, the empty string is valid for us and the doSomething is not run
  

Remarque : En réalité, c'est un exemple et dans un véritable projet, vous pouvez avoir un meilleur sens de cette belle utilisation de l'opération.

Attention : Pour le undefined ou null tous les deux agissent comme l'autre.