# Conditionals in Programming with Javascript

Mastering the use of conditions is one of the 5 fundamental skills of building algorithms:

1. Variables.
2. `Conditionals`.
3. Arrays/Objects.
4. Loops.
5. Functions.

Conditions are the only way developers have to tell the computer how to make decisions in real time, very similar to how our brains work.

Let's say we are building a program to help us pick what to wear and we hate the color blue. We can tell the computer to avoid blue using a condition like this:

`If` color is not blue, then... do something.
`Else`... do nothing or exit.

And this is how we would write this in Javascript:

``````if(color != 'blue'){
//any code here will run when color is different than blue
}
else{
//it will only run this code if color is blue.
}``````

The previous example was a simple condition, but in real life picking what to wear involves a combination of several conditions to make the final decision, for example: Let's look at this algorithm that tells if you have a flu.

If you want to represent this algorithm in Javascript it will look something like this:

``````let feelsLikeHitByTrain = true;
let youWereHitByTrain = false;

if(feelsLikeHitByTrain == true){
if(youWereHitByTrain == true){
console.log("You don't have a flu");
}
else{
console.log("You have a flu");
}
}
else{
console.log("You don't have a flu");
}``````

Basically, this algorithm has two variables to consider: `feelsLikeHitByTrain` and `youWereHitByTrain`. Our job as developers is to sit down and try to prepare a strategy and come up with an algorithm that solves a problem.

## `AND` and `OR` operators

Another way to write the algorithm is to combine two questions in the same condition using the `AND` and `OR` operators which in Javascript are represented with `&&` for AND and `||` for OR:

``````if(feelsLikeHitByTrain == false || youWereHitByTrain == true){
console.log("You don't have a flu");
}
else if(feelsLikeHitByTrain == true && youWereHitByTrain == false){
console.log("You have a flu")
}
else{
console.log("I have no idea");
}``````

As you can see here we are using `else if` together for the first time, for faster coding. Another trick you can use for faster coding:

OriginalEquivalent
instead of `if(feelsLikeHitByTrain == true)`you write `if(feelsLikeHitByTrain)`
instead of `if(feelsLikeHitByTrain == false)`you write `if(!feelsLikeHitByTrain)`

## `>` and `<` Greather Than or Lower Than Operators

In the particular case you are comparing numbers, to find out if one of the compared numbers is greater or lesser than the other:

``````if(age < 16){
console.log("You cannot drive");
}
else if(age >= 16){
console.log("You can drive");
}``````

## Ternary (inline conditions)

Another great trick for faster coding is using ternaries that basically allow us to code everything in just one line:

``const flu = (feelsLikeHitByTrain && !youWereHitByTrain) ? true : false;``

In this example the variable `flu` will only be true if `feelsLikeHitByTrain==true` and `youWereHitByTrain==false` at the same time. If that question is not true, then `flu` will be false.

Ternaries are being used A LOT these days because they save you a lot of time and we will also be able to use them later in jsx code (React).

## Conditional Rendering

Another important use of conditionals is to generate HTML based on certain conditions. For example, let's say that we have a bootstrap alert that we are about to render into the website:

``let alertHTMLCode = "<div>Warning! You cannot drive</div>";``

If we want this alert to show only if the user is younger that 16 years old we could do something like:

``````let age = 14;
let alertHTMLCode = (age < 16) ? "<div>Warning! You cannot drive</div>" : "";``````

Now our `alertHTMLCode` variable will be empty if the user age is greater than 16, if it's less it will contain the entire HTML.