Ejercicios Básicos de Fechas JavaScript
Vamos con unos ejercicios de fechas. Si no recuerdas cómo trabajar con fechas en JavaScript aquí te dejo el enlace a nuestro tutorial. Métodos de la clase Date JavaScript
Ejercicios
1.Realiza un script que escriba en el documento la fecha y hora actual. La salida deberá tener elsiguiente formato:
Hoy es martes, 28 de Febrero de 2018 y son las 14:32 horas.
Solución
<script>
var fecha = new Date(); //Obtiene un objeto fecha actual.
var dia;
var vardia = fecha.getDay(); //getDay() devuelve el dia de la semana.(0-6).
switch (vardia) { //Algoritmo para calcular el dia según el número.
case 0:
dia = "Domingo";
break;
case 1:
dia = "Lunes";
break;
case 2:
dia = "Martes";
break;
case 3:
dia = "Miercoles";
break;
case 4:
dia = "Jueves";
break;
case 5:
dia = "Viernes";
break;
case 6:
dia = "Sabado";
break;
}
var mes;
//Algoritmo para calcular el mes según el número.
switch (fecha.getMonth() + 1) { //getMonth() devuelve el mes (0-11).
case 1:
mes = "Enero";
break;
case 2:
mes = "Febrero";
break;
case 3:
mes = "Marzo";
break;
case 4:
mes = "Abril";
break;
case 5:
mes = "Mayo";
break;
case 6:
mes = "Junio";
break;
case 7:
mes = "Julio";
break;
case 8:
mes = "Agosto";
break;
case 9:
mes = "Septiembre";
break;
case 10:
mes = "Octubre";
break;
case 11:
mes = "Noviembre";
break;
case 12:
mes = "Diciembre";
break;
}
var diames = (fecha.getDate()); //getDate() devuelve el dia(1-31).
var ano = fecha.getFullYear(); //getFullYear() devuelve el año(4 dígitos).
var hora = fecha.getHours(); //getHours() devuelve la hora(0-23).
var min = fecha.getMinutes(); //getMinutes() devuelve los minutos(0-59).
if ((min >= 0) && (min < 10)) { //Algoritmo para añadir un cero cuando el min tiene 1 cifra.
min = "0" + min;
}
var salida = "Hoy es " + dia + ", " + diames + " de ";
var salida = salida + mes + " de " + ano + " y son las ";
var salida = salida + hora + ":" + min + " horas";
document.write(salida);
</script>
2. Realiza un script que pida un nombre y dos apellidos e indique el tiempo que se tardó en introducir los datos. La salida sería algo así como : En introducir Luís Perez Alonso ha tardado 25 segundos.
Solución
<script>
//Guardamos la fecha actual
var fecha1 = new Date();
//Obtenemos la fecha Unix (Milisegundos desde 1970 hasta el objeto fecha).
var tiempo1 = fecha1.getTime();
//Pedimos los datos por teclado
var nombre = prompt("Introduce el Nombre:");
var ape1 = prompt("Introduce apellido 1:");
var ape2 = prompt("Introduce Apellido 2:");
//Volvemos a guardar la fecha actual
var fecha2 = new Date();
//Y obtenemos la fecha Unix de esa fecha
var tiempo2 = fecha2.getTime();
//Calculamos el total entre la fecha 1 y la 2
var total = (tiempo2 - tiempo1) / 1000;
//Le decimos que fije los decimales en 1
total = total.toFixed(1);
//Imprimimos el resultado
document.write("En introducir " + nombre + " " + ape1 + " " + ape2 + " ha tardado " + total + " segundos.");
</script>
3. Realiza un script pida un mes y año e imprima su calendario. No hace falta esmerarse en la presentación del calendario, el calendario simplificado puede ser del tipo:
OCTUBRE – 2014
1 (miercoles), 2 (jueves), ….. , 31 (viernes).
Solución
<script>
//PEDIMOS EL MES Y EL AÑO EN NÚMERO
var mes = Number(prompt("Introduce Mes"));
var ano = Number(prompt("Introduce Año"));
//RESTAMOS 1 AL MES PORQUE EN JAVASCRIPT VAN DE 0-11
mes = mes - 1;
//CREAMOS UN OBJETO FECHA CON LOS DATOS
var fecha = new Date(ano, mes);
var vardia = fecha.getDay(); //getDay() devuelve el dia de la semana.(0-6).
//CALCULAMOS EL NOMBRE DEL MES SEGÚN EL NÚMERO
switch (mes) { //Algoritmo para saber el nombre del mes.
case 0:
mesletras = "Enero";
break;
case 1:
mesletras = "Febrero";
break;
case 2:
mesletras = "Marzo";
break;
case 3:
mesletras = "Abril";
break;
case 4:
mesletras = "Mayo";
break;
case 5:
mesletras = "Junio";
break;
case 6:
mesletras = "Julio";
break;
case 7:
mesletras = "Agosto";
break;
case 8:
mesletras = "Septiembre";
break;
case 9:
mesletras = "Octubre";
break;
case 10:
mesletras = "Noviembre";
break;
case 11:
mesletras = "Diciembre";
break;
}
//iMPRIMIMOS EL TÍTULO CON EL NOMBRE DEL MES Y EL AÑO
document.write("<h1>" + mesletras + " de " + ano + "</h1>");
//HACEMOS UN BUCLE QUE SE REPITA MIENTRAS EL MES NO CAMBIE
while (fecha.getMonth() == mes) {
//CALCULAMOS EL DIA DE LA SEMANA SEGÚN EL NÚMERO
switch (fecha.getDate()) { //Algoritmo para calcular el dia según el número.
case 0:
dia = "Domingo";
break;
case 1:
dia = "Lunes";
break;
case 2:
dia = "Martes";
break;
case 3:
dia = "Miercoles";
break;
case 4:
dia = "Jueves";
break;
case 5:
dia = "Viernes";
break;
case 6:
dia = "Sabado";
break;
}
//IMPRIMIMOS EL DÍA Y EL DIA DE LA SEMANA
document.write(fecha.getDate() + "(" + dia + ")<br>");
//SUMAMOS 1 DÍA AL OBJETO FECHA
fecha.setDate(fecha.getDate() + 1);
}
</script>
4. Realiza un script que pida una fecha y muestre tres fechas que sean la fecha introducida a 30, 60 y 90 días.
Solución
<script>
//PEDIMOS LOS DATOS POR TECLADO
var ano = Number(prompt("Año:"));
var mes = Number(prompt("Mes"));
var dia = Number(prompt("Día"));
mes--; //Restamos 1 para colocar el mes exacto en el objeto Date.
var fecha = new Date(ano, mes, dia); //Crea objeto fecha de la fecha introducida.
document.write("Fecha Actual: ");
if (fecha.getDate() < 10) { //Añadir un cero cuando el dia es menor que diez.
document.write("0" + fecha.getDate());
} else {
document.write(fecha.getDate());
}
document.write("/");
if (fecha.getMonth() < 9) { //Añadir un cero cuando el mes es menor que 9+1.
document.write("0" + (fecha.getMonth() + 1)); //Para mostrar el mes sumarle 1.
} else {
document.write(fecha.getMonth() + 1); //Sumamos 1 para que ponga el mes correcto.
}
document.write("/" + fecha.getFullYear() + ".<br>");
var i,j;
var plazo = 30; //Variable para sacar 30, 60 y 90.
for (i = 0; i < 3; i++) { //Bucle para las otras tres fechas.
document.write("Fecha a " + plazo + " días: ");
fecha.setMonth(fecha.getMonth() + 1); //Se suma un mes a la fecha.
if (fecha.getDate() < 10) { //Poner un cero delante en los dias menores de 10.
document.write("0" + fecha.getDate());
} else {
document.write(fecha.getDate());
}
document.write("/");
if (fecha.getMonth() < 9) { //Poner un cero delante a los meses menores de 9+1;
document.write("0" + (fecha.getMonth() + 1)); //Sumamos 1 para que ponga el mes correcto.
} else {
document.write(fecha.getMonth() + 1);
}
document.write("/" + fecha.getFullYear() + ".<br>");
plazo += 30;
}
</script>
5. Realiza un script que muestre un reloj en pantalla con fecha y hora y que se actualice cada segundo. Función setTimeout().
Solución
<HTML>
<HEAD>
<script language="JavaScript">
var reloj = 0;
var frecuencia = 1000;
function actualiza() {
var ahora = new Date();
var fecha = ahora.getDate() + " - " + (ahora.getMonth() + 1) + " - " + ahora.getFullYear();
var hora = ahora.getHours() + ":" + ahora.getMinutes() + ":" + ahora.getSeconds();
var escribe = 'Hoy es ' + fecha + ' y son las ' + hora + ' horas';
var situa = document.getElementById('capa0');
situa.innerHTML = escribe;
reloj = setTimeout("actualiza()", frecuencia);
}
</script>
<TITLE>Cronómetro</TITLE>
</HEAD>
<BODY onLoad="actualiza()" ;>
<div id="capa0"> </div>
</BODY>
</HTML>
Más ejercicios JavaScript
Más ejercicios JavaScript
Si te ha gustado no olvides compartir en redes sociales.
Espero que te haya servido. Cualquier duda deja un comentario. Un saludo
Una idea sobre “Ejercicios Básicos de Fechas JavaScript”
Kamilore, thanks! And thanks for sharing your great posts every week!