¿Hace cuántos días naciste?

Clase 50 de 55 • Fundamentos de JavaScript 2018

Resumen

Con variables de tipo Date, se pueden realizar operaciones de suma y resta similares a las que se realizan con números. El resultado que se obtiene está en milisegundos, por lo que luego hay que hacer algunas operaciones adicionales para llevarlos a días, meses o años según queramos. También aplica para Horas, Minutos, Segundos y Milisegundos.

Elio Alejandro Marcano Brito

student•

También existen métodos para obtener un valor de la fecha en específico. Estos métodos son:
getFullYear()
getMonth()
getDate()
getHours()
getMinutes()
getSeconds()
getMilliseconds()
getTime()
getDay()
Date.now()

Ejemplo:

var date = new Date()

var dateNow = {

	anio: date.getFullYear(),
	mes: date.getMonth(),
	dia: date.getDay()

}

console.log(`Hoy es: ${dateNow.dia}-${dateNow.mes}-${dateNow.anio}`)

Jesus Ricardo Moreira Cedeño

student•

Gracias 😃

Alejandro Iscop

student•

Gracias,

Edgar Oswaldo Vargas Jara

student•

Hice una página para saber cuándo acaba el gobierno de Duque :)

https://edgosw105.github.io/CuentaRegresiva/ Aqui el repositorio: Github

Luis Felipe Medina Rodriguez

student•

fino

Gustavo Adolfo Abello Fernandez

student•

jajajajajaja

Daniel Cabrera López

student•

intente hacer mi código un poco más interactivo con el usuario :)

    <script>
        var año = prompt('Que año naciste?')
        var mes = prompt('que mes naciste?') - 1
        var dia = prompt('que día naciste?')

    let danny = {
        nombre: 'Daniel',
        apellido: 'Cabrera',
        nacimiento: new Date(año, mes, dia)
    }


    const hoy = new Date()

    function diasEntreFechas (fecha1, fecha2){
        const unDia = 1000 * 60 * 60 * 24
        const diferencia = Math.abs(fecha1 - fecha2)
        return Math.floor(diferencia / unDia)

    }
        
    console.log((`hola! naciste hace: ${diasEntreFechas(hoy,danny.nacimiento)} días`))
    var n = diasEntreFechas(hoy,danny.nacimiento) / 365
    var numero = n.toFixed(2)
    console.log(`que siendo un poco mas claros serian: ${numero} años :)`)
    </script>```

Ezequiel Maximiliano Silvestre

student•

Está muy bien! Creo que podría quedar aún mejor si en vez de usar 3 veces prompt para preguntar año, mes y día de nacimiento, pusieras un campo de texto que te deje elegir directamente la fecha en un calendario. Esto lo puedes hacer utilizando en html <input type="date">. Fijate que si haces esto, en tu página saldrá un campo de texto en el que el usuario puede tipear la fecha de su nacimiento, o bien elegirla desde un calendario que de desplega de forma automática al hacer click. Con esa información ya luego creas el objeto Date y le pasas como parámetros los datos que te dió el usuario, de esa forma tu código sigue funcionando igual, pero con una experiencia de usuario más ágil

Javier Leonardo Diaz Avila

student•

Wow, se que no es un aporte importante, pero a la fecha del vídeo tenía casi la misma edad de Sacha, apenas 46 días de diferencia:

Juan Marcos Caicedo Mejía

student•

Hola, No sé si también les pasó, yo estoy en Linux y coloqué mi fecha de nacimiento:

const nacimiento = new Date(1999, 11, 16);

Y en Google Chrome me decía que era 16 de Diciembre, cuando nací un 16 de Noviembre. No sé realmente por qué pasa, pero leí que el creador de JS, Brendan Eich, usó java.util.Date de JDK 1.0 (por allá en 1995) y lo puso en JS. Esto hace que los meses en vez de ir del 1 al 12 vayan del 0 al 11. Sólo para mencionar como dato histórico. Todo esto es basado en el estándar de tiempo POSIX de C http://linux.die.net/man/3/localtime. O probablemente pasó porque como estoy en Linux, a lo mejor el Browser ingresó a mi S.O. y lo tomó de allí. Una cosa u otra, tengan precaución!

Alvaro Armando Chamale Yancis

student•

Segun la documentacion de MDN Date maneja los meses de esa manera https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date. Liberias como moment.js lo menejan igual.

Jhonanderson Tellez Parra

student•

en estos casos a la variable mes siempre hay que establecer una operación que le sume 1

Carlos Eduardo Gomez García

teacher•

Las fechas en JavaScript son todo un tema... hay veces en el las que JavaScript te puede decir que el día de hoy es mañana, etc, eso pasa cuando no ponemos la zona horaria y demás.

Afortunadamente existen paquetes que nos facilitan mucho todo esto, una de ellas es moment.js, o también pueden ver la documentación completa con todas las funciones para fechas que tenemos disponibles:

https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Objetos_globales/Date

Jeison Sneider Ruiz Zemanate

student•

codigo JS clase 42 -->Manejo de fechas preee

function diasEntreFechas(fecha1,fecha2){

    const unDia = 1000*60*60*24
    const diferencia = Math.abs(fecha1- fecha2)

    return Math.floor(diferencia/unDia)

}

const hoy= new Date()
const nacimiento =new Date(1996,2,14)

Andres Menchaca

student•

Feliz Cumpleaños Sacha (un día antes) 😎.

Jose L. Figueroa

student•

Al declarar variables tipo fecha con new Date nos es posible realizar cálculos entre fechas.

Pablo Andres

student•

Resumen de la clase:
Manejo de Fechas:

A las fechas podemos restarlas o sumarlas.
Math.abs() nos permite poner cualquier fecha en el primer orden de tal manera que el resultado siempre sea positivo o ‘absoluto’’.
La suma o resta nos da un número expresado en milisegundos.

function diasEntreFechas(fecha1, fecha2) {
	const unDia = 1000 * 60 *60 * 24	//1000ms x 60sec x 60min x 24hs
	const diferencia = Math.abs(fecha1 - fecha2)

	return Math.floor(diferencia / unDia)
}

const hoy = new Date()   // fecha actual por defecto
const nacimiento = new Date(1981, 08, 12)   // el constructor de new Date() recibe año, mes (enero=00) y el día.

diasEntreFechas(hoy, nacimiento)  // == 13638   si divido esta cantidad de días por 365 obtendré la edad en años.

Rigoberto Maldonado

student•

Bune dia champion... dejo mi aporte, trabjando con .date()....

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Date Management</title>
  <link rel="stylesheet" href="./css/style.css">
  <link rel="preconnect" href="https://fonts.gstatic.com">
  <link href="https://fonts.googleapis.com/css2?family=Poppins:wght@300&display=swap" rel="stylesheet">
  <!-- <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-+0n0xVW2eSR5OomGNYDnhzAbDsOXxcvSN1TPprVMTNDbiYZCxYbOOl7+AMvyTG2x" crossorigin="anonymous"> -->
</head>

<body>
  <div class="container">
    <!-- <img class="logo" src="/assets/chess-solid.svg" alt="chess"> -->
    <h2>How many days were you born?</h2>
    <form action="" id="box-container">
      <div class="box-container">
        <label>Name</label>
        <input type="text" id="name" placeholder="Full Name" required>
        <label>Year</label>
        <input type="number" id="year" placeholder="1880" required>
        <label>Month</label>
        <input type="number" id="month" placeholder="0 1 2 3 4 5 6 7 8 9 10 11" required>
        <label>Day</label>
        <input type="number" id="day" placeholder="0 - 31" required>
        <input class="submit" type="submit" id="calculate" value="Calculate" >
      </div>
    </form>
    <p class="message" id="message"></p>
  </div>

  <footer>
    <p>Copyright © 2021. <strong style="color:rgb(22, 23, 26)">Bruno Maldonado. </strong>All Rights Reserved.</p>
  </footer>

  <script>
    let calculate = document.getElementById('calculate');
    let message = document.getElementById('message');

    // function daysBetweenDate(date1, date2) {
    //     const oneDay = 1000 * 60 * 60 * 24;
    //     const difference = Math.abs(date1 - date2); //abs significa numeros absolutos si es negativo te da positivo.

    //     return Math.floor(difference / oneDay);
    //   }

    //   const now = new Date();
    //   const birth = new Date(1994, 06, 30);

   class  UI {
    resetForm(){
      document.getElementById('box-container').reset();
    }
   }

    function calculated(e) {
      let day = document.getElementById('day').value;
      let month = document.getElementById('month').value;
      let year = document.getElementById('year').value;

      let users = {
        name: document.getElementById('name').value,
      }

      function daysBetweenDate(date1, date2) {
        const oneDay = 1000 * 60 * 60 * 24;
        const difference = Math.abs(date1 - date2); //abs significa numeros absolutos si es negativo te da positivo.

        return Math.floor(difference / oneDay);
      }

      const now = new Date();
      // const birth = new Date(1994, 06, 30);
      const birth = new Date(year, month, day);

      // console.log(`How are you champion! ${users.name}. Today is: ${now.toDateString()}`);
      // console.log(`${users.name}. You were born: ${birth.toDateString()}`);
      // console.log(`You have ${daysBetweenDate(now, birth)} days since you born `);
      // console.log(`Now, you have ${(daysBetweenDate(now, birth)/365).toFixed(0)} years old`)

      message.innerHTML =
        `How are you champion! ${users.name}. Today is: ${now.toDateString()}. You were born long long time ago ${birth.toDateString()}, You have ${daysBetweenDate(now, birth)} days since you born... <br> Now, you have ${(daysBetweenDate(now, birth)/365).toFixed(0)} years old. `;
  
        const ui = new UI();
        ui.resetForm();

      e.preventDefault();
    }

    //Event listeners
    calculate.addEventListener('click', calculated)
  </script>
</body>

</html>

.... css