How to perform Ternary statement for 3 conditions with one default condition

user_8459335 0
Viewed 524

Is it possible to perform ternary for 3 conditions but with one default condition ?

Here is my code : 

<Button
  rounded={true}
  title='Add Address'
  backgroundColor='#2980b9'
  rightIcon={{name: 'arrow-forward'}}
  disabled={this.state.timeSlotItemSelected === null || this.state.quantityItemSelected === null ? true : false}
/>

In this, this.state.timeSlotItemSelected is default. What I need, is whenever this.state.timeSlotItemSelected and this.state.quantityItemSelected are null, the result should be true, and whenever this.state.timeSlotItemSelected and this.state.deliveryOptionSelected are null, then it should also be true. Otherwise it should be false.

How do I perform this for both conditions?

react-native ternary-operator javascript
3 Answers

You can do this with a simple combination of && and ||, and no need of the ternary operator at all.

this.state.timeSlotItemSelected === null &&
    (this.state.quantityItemSelected === null || this.state.deliveryOptionSelected === null)

This will be true if this.state.timeSlotItemSelected is null, and if either one of this.state.quantityItemSelected or this.state.deliveryOptionSelected is null, and false otherwise.

Truth table:

timeSlotItemSelected | quantityItemSelected | deliveryOptionSelected | Result
---------------------+----------------------+------------------------+-------
null                 | null                 | null                   | true
null                 | <not null>           | null                   | true
null                 | null                 | <not null>             | true
null                 | <not null>           | <not null>             | false
<not null>           | <anything>           | <anything>             | false

You do not need the ternary operator in this case, because the expression itself will return true or false: <Expression> ? true : false = <Expression>.

user_14060830

(this.state.timeSlotItemSelected === null && this.state.quantityItemSelected === null) || ( this.state.deliveryOptionSelected === null && this.state.timeSlotItemSelected === null) ? true : false

user_105022670

This is some Boolean algebra (I will probably use the wrong words, I learned math in german, so edits or comments are appreciated):

Let's start with your verbal conditions translated into JavaScript (I deleted this.state for better readability):

(timeSlotItemSelected === null && quantityItemSelected === null) || (timeSlotItemSelected === null && deliveryOptionSelected === null)

We can factor out timeSlotItemSelected, so it looks like this:

timeSlotItemSelected === null && (quantityItemSelected === null || deliveryOptionSelected === null)

Now you can use it in an if-clause or a ternary operator.

Concerning your question for a "default condition":

There is literally no way to have a default when working with boolean, they are either true or false.

This means: If an if-clause or a ternary operator have a boolean as input (which they have in JavaScript and most other languages), they cannot have a third case for a default, because a boolean can only be true or false.

A variable with the type boolean can have a default value (e.g. false in Java), but not in JavaScript.

user_30492520
Related