There are already a few solutions above, but here's the reason for the error: operator precedence. The && has higher priority than ||, therefore p && q || r is evaluated as (p && q) || r. https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Operator_precedence

And yes, one solution would be to put parentheses to enforce the evaluation you want, so

p && (q || r).

I was face same problem ..... And I got solution by using typeof()

if (typeof(value) !== 'undefined' && value != null) {
         console.log('Not Undefined and Not Null')
  } else {
         console.log('Undefined or Null')
}

You must have to use typeof() to identified undefined

The standard way to catch null and undefined simultaneously is this:

if (variable == null) {
     // do something 
}

--which is 100% equivalent to the more explicit but less concise:

if (variable === undefined || variable === null) {
     // do something 
}

When writing professional JS, it's taken for granted that type equality and the behavior of == vs === is understood. Therefore we use == and only compare to null.

Edit again

The comments suggesting the use of typeof are simply wrong. Yes, my solution above will cause a ReferenceError if the variable doesn't exist. This is a good thing. This ReferenceError is desirable: it will help you find your mistakes and fix them before you ship your code, just like compiler errors would in other languages. Use try/catch if you are working with input you don't have control over.

You should not have any references to undeclared variables in your code.

You could be explicit and do the following...

// Check specifically for null or undefined
if(financialPerformance === null || financialPerformance === undefined) {
            // Code...
}

// Checking for zero, could be returned ( not sure on your data )
if(financialPerformance === 0 || financialPerformance) {
             // Code...
}

This question has two interpretations:

Check if the variable has a value
Check if the variable has a truthy value

The following answers both.

In JavaScript, a value could be nullish or not nullish, and a value could be falsy or truthy.
Nullish values are a proper subset of falsy values:

 ╭─ nullish ──────╮ ╭─ not nullish ─────────────────────────────────╮
┌───────────┬──────┬───────┬───┬────┬─────┬──────┬───┬─────────┬─────┐
│ undefined │ null │ false │ 0 │ "" │ ... │ true │ 1 │ "hello" │ ... │
└───────────┴──────┴───────┴───┴────┴─────┴──────┴───┴─────────┴─────┘
 ╰─ falsy ───────────────────────────────╯ ╰─ truthy ───────────────╯

Check if value is nullish (undefined or null)

Use one of the following depending on your coding style:

if (value == null)                         { /* value is nullish */ }
if (value === undefined || value === null) { /* value is nullish */ }
if (value == undefined)                    { /* value is nullish */ }
if ((value ?? null) === null)              { /* value is nullish */ }

Notes:

• The == operator works because it has a special case for null vs undefined comparison
• The === operator is more readable (opinion based), eqeqeq friendly and allows checking for undefined and null separately
• The first and third examples work identically, however the third one is rarely seen in production code
• The fourth example uses nullish coalescing operator to change nullish values to null for straight forward comparison

Check if value is not nullish

if (value != null)                         { /* value is not nullish, although it could be falsy */ }
if (value !== undefined && value !== null) { /* value is not nullish, although it could be falsy */ }
if (value != undefined)                    { /* value is not nullish, although it could be falsy */ }
if ((value ?? null) !== null)              { /* value is not nullish, although it could be falsy */ }

Check if value is falsy

Use the ! operator:

if (!value) { /* value is falsy */ }

Check if value is truthy

if (value) { /* value is truthy */ }

Data validation

The nullish, falsy and truthy checks cannot be used for data validation on their own. For example, 0 (falsy) is valid age of a person and -1 (truthy) is not. Additional logic needs to be added on case-by-case basis. Some examples:

/*
 * check if value is greater than/equal to 0
 * note that we cannot use truthy check here because 0 must be allowed
 */
[null, -1, 0, 1].forEach(num => {
  if (num != null && num >= 0) {
    console.log("%o is not nullish and greater than/equal to 0", num);
  } else {
    console.log("%o is bad", num);
  }
});

/*
 * check if value is not empty-or-whitespace string
 */
[null, "", " ", "hello"].forEach(str => {
  if (str && /\S/.test(str)) {
    console.log("%o is truthy and has non-whitespace characters", str);
  } else {
    console.log("%o is bad", str);
  }
});

/*
 * check if value is not an empty array
 * check for truthy before checking the length property
 */
[null, [], [1]].forEach(arr => {
  if (arr && arr.length) {
    console.log("%o is truthy and has one or more items", arr);
  } else {
    console.log("%o is bad", arr);
  }
});

/*
 * check if value is not an empty array
 * using optional chaining operator to make sure that the value is not nullish
 */
[null, [], [1]].forEach(arr => {
  if (arr?.length) {
    console.log("%o is not nullish and has one or more items", arr);
  } else {
    console.log("%o is bad", arr);
  }
});

• In simple function you do it simply by if statement.

if(typeof x !=='undefined' && typeof x.item !=='undefined'){

}

• in JSX you do it in this way.

render(){
return(
          <div>
          (typeof x !=='undefined' && typeof x.item !=='undefined')?
                <div>success</div>:           
                <div>fail</div>
          </div>
          )
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script>