3

I am trying to reduce the function cognitive complexity required by SonarQube, I am wondering, are these two if statements equivalent?

The first statement:

           if (
              currentRef &&
              currentRef.current &&
              currentRef.current.value.length === 0
            )

I want to replace it by :

            if (
              currentRef?.current?.value.length === 0
            )
badm
  • 219
  • 2
  • 13
  • it could be some odd corner cases, that maybe this two won't be equal; for example if we have something like this: currentRef = { current: 0} the second one throw an error. but the first one in not. it depends on the currentRef – Ebay Jul 21 '22 at 07:00

2 Answers2

4

Yes.

Optional chaining returns undefined in case of an invalid reference. MDN docs state:

The ?. operator is like the . chaining operator, except that instead of causing an error if a reference is nullish (null or undefined), the expression short-circuits with a return value of undefined. When used with function calls, it returns undefined if the given function does not exist.

However, keep this in mind:

Optional chaining cannot be used on a non-declared root object, but can be used with an undefined root object.

Example

const dog = {'foo': 0};

console.log(dog?.foo === 0);
console.log(dog?.bar === 0);
Hackinet
  • 3,252
  • 1
  • 10
  • 22
0

The two statements in your question are equivalent, which means that for a given value, they will both return either true or false.

See this playground demo

It is important to mention that

if (currentRef?.current?.value.length === 0)

is the preferred syntax for these statements, since they also allow you to use a default value using nullish concealing.

No nullish concealing:

if (currentRef?.current?.value.length === 0) 
// computes to false if 'currentRef or 'current' is undfined'

With nullish concealing:

if ((currentRef?.current?.value.length ?? 0) === 0) 
// computes to true if 'currentRef or 'current' is undfined'