Variables, tipos y matemática

Resumen

2° día de los 100! Vamos a ver lo que he aprendido el día de hoy en JS:

• Insertar scripts en HTML
• Ver los tipos de variables: string, number, null, undefinded, boolean y object
• Cómo declarar las variables con var, let y const
• Hacer operaciones matemáticas básicas y métodos Math

Luego de la parte teórica, voy a inventar un ejercicio práctico en donde utilice la mayor parte de lo aprendido.

Podrás ver la lista de los 100 días en este enlace.

JavaScript en HTML

• Insertamos JS mediante etiquetas HTML dentro de body (por lo general, al final)

<script>
    const nombre = 'Javier'
    console.log("Hola " + nombre);
</script>

Una alternativa más cómoda es usar este formato:

<!-- En nuestro HTML -->
<script src="javascript.js"></script>

// En un script llamado javascript.js
const nombre = 'Javier'
console.log("Hola " + nombre);

Tipos de variables

Existen 6 tipos de datos en JS:

• string: cadena de caracteres
• number: estos pueden ser enteros o reales
• null: valor nulo
• undefined: valor no definido (pero si declarado)
• boolean: admite true o false
• objetos: es una forma de tener un conjunto de propiedades

Declaración de variables

Hay 3 formas de declarar una variable:

• const: No se puede modificar!
• let: Se puede modificar.
• var: Se puede modificar. No se suele utilizar desde que salió la versión de ES6 (EcmaScript 6)

    const nombre = 'Javier';
    let edad = 25;

    console.log(nombre + ' tiene ' + edad);
    edad = edad + 1;
    console.log('El año que viene tendrá ' + edad);

Strings

Podemos usar comillas simples, dobles y backticks para los strings

    const oracion = 'Soy Javier "Javo" Rodriguez';
    const sentence = "I'm Javier";
    const name = 'Javo';

    console.log(`Hola ${name}`);

${name} es un template string, algo copado que agregaron en ES6.
Podemos también agregar texto multilínea usando backticks

Operaciones

Como en cualquier lenguaje, tenemos las operaciones básicas:

const a = 20;
const b = 20;

console.log(a + b); // Suma: 40
console.log(a - b); // Resta: 0
console.log(a * b); // Producto: 400
console.log(a / b); // División: 1
console.log(a % b); // Resto: 0

En el caso de que tuvieramos un number y realizamos una operación con un string, podemos solucionarlo así:

const a = 3;
const b = '7';

console.log(a + b); // 37 ???
console.log(a * b); // 21 ???

En la suma, vemos como se concatenan a y b, debido a que uno de los dos es un string. Pero en el producto, JS realiza un parse a b, convirtiendolo en un tipo number, dando el resultado correcto de una operación matemática.

Puede ser útil saber qué tipo de variable estamos manipulando:

const b = '7';

console.log(typeof b) // string

Métodos Math

Siendo una variable x que contiene un valor numérico

• Math.round(x): redondea un número al entero más cercano
• Math.floor(x): redondea un número al entero menor (si tengo 3.9, redondea a 3)
• Math.ceil(x): caso inverso a Math.floor(x), redondea a un entero mayor
• Math.random(): nos dá un número aleatorio entre 0 y 1

Objetos

Son un tipo de variable en la cual nos sirve para agrupar propiedades. Un ejemplo sería:

const perro{
    edad: 5,
    nombre: 'Peluchin',
    patas: 4,
    collar: 'rojo'
}

Están ordenados por clave: valor. edad es una clave, 5 es el valor.
Podemos acceder a estas propiedades de esta manera:

console.log(perro.collar); // rojo

Práctica

Tengo una verdulería y quiero saber:

• Promedio de venta de manzana en 5 días si vendo el lunes 3, el martes 4, miércoles 10 jueves 8 y viernes 22 manzanas.
• Si tengo un cajón de 100 manzanas, debo avisar cuántas manzanas hay.
• Mi sobrino Kevin compra 20 naranjas para repartir a 3 chicos. Las que sobran, se las come el. También tengo 100 naranjas en un cajón. Y como sé JavaScript, hago un objeto "stock" y otro "sobrino", con los datos que sé. Al promedio de manzanas vendidas las redondeo al valor entero mayor. También agrego como objeto las ventas de los 5 días :D

const stock = {
    manzanas: 100,
    naranajas: 100
};

const ventaManzanas = {
    mon: 3,
    tue: 4,
    wed: 10,
    thu: 8,
    fri: 22
}

const sobrino = {
    name: 'Kevin',
    compra: 20
};

let suma = ventaManzanas.mon + ventaManzanas.tue + ventaManzanas.wed + ventaManzanas.thu + ventaManzanas.fri;
let promSup = Math.ceil(suma / 5);
console.log('Promedio de 5 días en venta de manzanas: ' + promSup);

stock.manzanas = stock.manzanas - suma;
console.log(`Me quedan en stock ${stock.manzanas} manzanas`)

stock.naranajas = stock.naranajas - sobrino.compra;
console.log(`Mi sobrino ${sobrino.name} compra ${sobrino.compra} narnajas y me quedan ${stock.naranajas} en stock`);

let reparte = Math.floor(sobrino.compra / 3);
sobrino.compra = sobrino.compra - reparte * 3;
console.log(`${sobrino.name} reparte ${reparte} naranjas a cada chico y se queda con ${sobrino.compra}`)

El resultado por consola da esto:

Día 2/100