Tomar decisiones y controlar el orden en que se ejecuta su código hace que su código sea reutilizable y robusto. Esta sección cubre la sintaxis para controlar el flujo de datos en JavaScript y su importancia cuando se usa con tipos de datos booleanos.
Los booleanos pueden tener solo dos valores: `true` o` false`. Los booleanos ayudan a tomar decisiones sobre qué líneas de código deben ejecutarse cuando se cumplen ciertas condiciones.
Establezca su booleano en verdadero o falso de esta manera:
`let myTrueBool = true`
`let myFalseBool = false`
✅ Los booleanos llevan el nombre del matemático, filósofo y lógico inglés George Boole. (1815–1864).
## Operadores de comparación y valores booleanos
Los operadores se utilizan para evaluar las condiciones haciendo comparaciones que crearán un valor booleano. La siguiente es una lista de operadores que se utilizan con frecuencia.
| `<` | **Mayor que**: compara dos valores y devuelve el tipo de datos booleano `true` si el valor del lado derecho es mayor que el del izquierdo | `5 < 6 // true` |
| `<=` | **Mayor o igual que**: compara dos valores y devuelve el tipo de datos booleano `true` si el valor del lado derecho es mayor o igual que el del lado izquierdo | `5 <= 6 // true` |
| `>` | **Menor que**: compara dos valores y devuelve el tipo de datos booleano `true` si el valor del lado izquierdo es mayor que el del derecho | `5 > 6 // false` |
| `=>` | **Menor o igual que**: compara dos valores y devuelve el tipo de datos booleano `true` si el valor del lado izquierdo es mayor o igual que el del lado derecho | `5 => 6 // false` |
| `===` | **Igualdad estricta**: compara dos valores y devuelve el tipo de datos booleano `true` si los valores de la derecha y la izquierda son iguales Y son del mismo tipo de datos | `5 === 6 // false` |
| `!==` | **Desigualdad**: compara dos valores y devuelve el valor booleano opuesto de lo que devolvería un operador de igualdad estricta | `5 !== 6 // true` |
✅ Compruebe sus conocimientos escribiendo algunas comparaciones en la consola de su navegador. ¿Te sorprende algún dato devuelto?
## Declaración If
La sentencia if ejecutará código entre sus bloques si la condición es verdadera.
```javascript
if (condition){
//La condición era verdadera. Se ejecutará el código de este bloque.
}
```
Los operadores lógicos se utilizan a menudo para formar la condición.
```javascript
let currentMoney;
let laptopPrice;
if (currentMoney >= laptopPrice){
//La condición era verdadera. Se ejecutará el código de este bloque.
console.log("Getting a new laptop!");
}
```
## IF..Else Declaración
La declaración `else` ejecutará el código entre sus bloques cuando la condición sea falsa. Es opcional con una declaración `if`.
```javascript
let currentMoney;
let laptopPrice;
if (currentMoney >= laptopPrice){
//La condición era verdadera. Se ejecutará el código de este bloque.
console.log("Getting a new laptop!");
}
else{
//La condición era verdadera. Se ejecutará el código de este bloque.
console.log("Can't afford a new laptop, yet!");
}
```
✅ Pruebe su comprensión de este código y del siguiente código ejecutándolo en una consola de navegador. Cambie los valores de las variables currentMoney y laptopPrice para cambiar el `console.log()` devuelto.
## Operadores lógicos y booleanos
Las decisiones pueden requerir más de una comparación y se pueden unir con operadores lógicos para producir un valor booleano.
| `&&` | **AND lógico**: compara dos expresiones booleanas. Devuelve verdadero **solo** si ambos lados son verdaderos | `(5 > 6) && (5 < 6 ) //Un lado es falso, el otro es verdadero. Devuelve falso` |
| `||` | **OR lógico**: compara dos expresiones booleanas. Devuelve verdadero si al menos un lado es verdadero | `(5 > 6) || (5 < 6) //Un lado es falso, el otro es verdadero. Devuelve verdadero` |
| `!` | **NOT lógico**: Devuelve el valor opuesto de una expresión booleana | `!(5 > 6) // 5 no es mayor que 6, pero "!" devolverá verdadero` |
## Condiciones y decisiones con operadores lógicos
Los operadores lógicos se pueden utilizar para formar condiciones en sentencias if..else.
```javascript
let currentMoney;
let laptopPrice;
let laptopDiscountPrice = laptopPrice - (laptopPrice * .20) //Precio del portátil al 20% de descuento
if (currentMoney >= laptopPrice || currentMoney >= laptopDiscountPrice){
//La condición era verdadera. Se ejecutará el código de este bloque.
console.log("Getting a new laptop!");
}
else {
//La condición era verdadera. Se ejecutará el código de este bloque.
console.log("Can't afford a new laptop, yet!");
}
```
### Operador de negación
Hasta ahora has visto cómo si puedes usar una instrucción `if...else` para crear lógica condicional. Cualquier cosa que entre en un `if` debe evaluarse como verdadero / falso. Utilizando el operador `!` Puede _negar_ la expresión. Se vería así:
```javascript
if (!condition) {
// se ejecuta si la condición es falsa
} else {
// se ejecuta si la condición es verdadera
}
```
### Expresiones ternarias
`If...else` no es la única forma de expresar la lógica de decisión. También puede usar algo llamado operador ternario. La sintaxis tiene el siguiente aspecto:
```javascript
let variable = condition ? <returnthisiftrue> : <returnthisiffalse>`
```
A continuación se muestra un ejemplo más tangible:
```javascript
let firstNumber = 20;
let secondNumber = 10
let biggestNumber = firstNumber > secondNumber ? firstNumber: secondNumber;
```
✅ Tómese un minuto para leer este código varias veces. ¿Entiende cómo trabajan estos operadores?
Lo anterior establece que
- si `firstNumber` es mayor que `secondNumber`
- luego asigne `firstNumber` a `biggestNumber`
- de lo contrario, asigne `secondNumber`.
La expresión ternaria es solo una forma compacta de escribir el siguiente código:
```javascript
let biggestNumber;
if (firstNumber > secondNumber) {
biggestNumber = firstNumber;
} else {
biggestNumber = secondNumber;
}
```
🚀 Desafío: cree un programa que se escriba primero con operadores lógicos y luego vuelva a escribirlo utilizando una expresión ternaria. ¿Cuál es tu sintaxis preferida?
Más información sobre los muchos operadores disponibles para el usuario [en MDN](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Operators).
