-1

I have been encountering with this conditional operator,

phone={this.props.projectDetails?.agency?.phone ?? this.props.projectDetails.phone }

I wanted to use Phone number that is given in agency?.phone but at some point we didn’t had phone number in agency so we were using projectDetail's phone so overcome this issue.

  • https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Nullish_coalescing – 0stone0 Dec 08 '22 at 12:06
  • Does this answer your question? [What does this symbol mean in JavaScript?](https://stackoverflow.com/questions/9549780/what-does-this-symbol-mean-in-javascript) – 0stone0 Dec 08 '22 at 12:07
  • Does this answer your question? [How is the nullish coalescing operator (??) different from the logical OR operator (||) in ECMAScript?](https://stackoverflow.com/questions/65022531/how-is-the-nullish-coalescing-operator-different-from-the-logical-or-operat) – AKX Dec 08 '22 at 12:10

3 Answers3

1

Nullish coalescing operator means If is null or undefined you will render projectDetails.phone prop

victor zadorozhnyy
  • 889
  • 1
  • 12
  • 25
1

it's Nullish coalescing operator and in your case exactly equal to this :

phone={this.props.projectDetails?.agency?.phone ? this.props.projectDetails.agency.phone : this.props.projectDetails.phone }
Ali Sattarzadeh
  • 3,220
  • 1
  • 6
  • 20
  • That's not true, ternary operator's [*falsy*](https://developer.mozilla.org/en-US/docs/Glossary/Falsy) values are different than the Nuillish coalescing which [works exactly like the logical OR operator, except you will get the right side value when the left side value is `undefined` or `null`](https://www.freecodecamp.org/news/how-the-question-mark-works-in-javascript) – Aleksandar Apr 17 '23 at 13:38
0

In case if we don't have any else condition , use Nullish coalescing operator (??)

this.props.projectDetails?.agency?.phone (if it has value) ?? (then show) this.props.projectDetails.phone

.. https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Nullish_coalescing

  • this.props.projectDetails?.agency?.phone (if it has value then show it) ?? (Otherwise show this) this.props.projectDetails.phone – Ali Sher Khan Jan 16 '23 at 06:29