Читать книгу JavaScript: Guía completa - Alessandra Salvaggio - Страница 15

Pasar parámetros a las funciones

Оглавление

Hasta ahora, hemos escrito funciones que elaboran datos que ya poseen y devuelven como mínimo un valor.

En realidad, es posible pasar uno o más datos (denominados parámetros) a la función en el momento en que esta se llama.

La función utilizará los datos pasados para sus elaboraciones y después estos influirán en el resultado de dicha función.

Comprobémoslo con un ejemplo:

<body><p id="output"></p><img id="carita" /><script type="text/javascript">function queDia(nombre) {const dia = new Date().getDay();const nombreDia = ['Domingo', 'Lunes', 'Martes', 'Miércoles', 'Jueves', 'Viernes', 'Sábado'];return `Hola ${nombre}! Feliz ${nombreDia[dia]}`;}document.getElementById('output').innerHTML = queDia('Alessandra');</script></body>

Puedes encontrar este ejemplo en el archivo FuncionesParametros .html

El comportamiento de esta función debería resultarte familiar; así podemos centrarnos en la gestión del parámetro.

Como puedes ver, la función, desde su definición, está predispuesta a aceptar un parámetro, nombre, en nuestro caso, que posteriormente será pasado (‘Alessandra’) en el momento en que la función es llamada.

En este ejemplo, hemos pasado un único parámetro, pero las funciones de JavaScript pueden aceptar más de uno.

Con este propósito, os proponemos otro ejemplo:

<script type="text/javascript">function cuantosDias(año, mes, dia, NombreEvento) {const hoy = new Date();const milsegEnUnDia = 1000 * 60 * 60 * 24; // los milisegundos de un día// indico a media noche la fecha de hoy, de no ser así la resta entre ambas fechas no nos dará la hora correctahoy.setHours(0, 0, 0, 0);const fechaEvento = new Date(año, mes - 1, dia)const diferenciaHoras = Math.abs(fechaEvento.getTimezoneOffset() / 60) - Math.abs(hoy.getTimezoneOffset() / 60);hoy.setHours(hoy.getHours() - diferenciaHoras);if (fechaEvento > hoy) {return `Faltan ${(fechaEvento.getTime() - hoy.getTime()) / milsegEnUnDia} días para ${NombreEvento}`;} else {return 'La fecha ya pasó'}}document.getElementById('output').innerHTML = cuantosDias(2017, 12, 25, 'Navidad');</script>

Puedes encontrar este ejemplo en el archivo FuncionesParametros1 .html

Esta vez la función es más compleja y prevé que se pasen cuatro parámetros: un año, un mes, un día y un evento. La función utilizará los primeros tres parámetros para crear una fecha y calcular cuántos días faltan para dicha fecha (obviamente, si esta todavía no ha pasado). El cuarto parámetro no es otro que un nombre para el evento representado por la fecha a partir de la cual calculamos los días que faltan.

Veamos cómo ocurre todo esto, puesto que la función contiene muchas novedades.

En primer lugar, además de la constante que representa la fecha, se crea otra que representa la duración de un día en milisegundos, porque la diferencia entre las fechas será devuelta exactamente en milisegundos y nosotros podremos utilizar el valor de esta constante para aplicar el resultado obtenido a varios días.

const milsegEnUnDia = 1000 * 60 * 60 * 24

Una vez hecho esto, indicamos la fecha de hoy a media noche. Si no lo hacemos, la fecha contiene también la hora del momento en que se ha creado y será más difícil de comparar con la fecha que crearemos con los parámetros pasados a la función que, en cambio, no contendrá un horario y, por tanto, hará referencia a la media noche:

hoy.setHours(0, 0, 0, 0);

setHours, efectivamente, ajusta la hora de una fecha. Requiere como argumentos hora, minutos, segundos y milisegundos.

En este momento, creamos la fecha con los parámetros que han sido pasados, sin olvidarnos de restar 1 al valor pasado para el mes, dado que JavaScript utiliza para los meses números que van del 0 (enero) al 11 (diciembre).

const fechaEvento = new Date(año, mes - 1, dia);

Para que nuestra función se comporte correctamente con o sin la horal legal, debemos ajustar el horario de la fecha de hoy de manera que tenga en cuenta el posible cambio de hora causado por la hora legal:

const diferenciaHoras = Math.abs(fechaEvento.getTimezoneOffset() / 60) - Math.abs(hoy.getTimezoneOffset() / 60);hoy.setHours(hoy.getHours() - diferenciaHoras);

Como ya sabéis (puesto que lo hemos visto en el capítulo ¡Hola mundo!), getTimezoneOffset devuelve la diferencia en minutos entre el UTC y la hora local. Si dividimos este resultado entre 60, obtendremos las horas.

En este momento, recurrimos al objeto Math, que todavía no había salido, y que nos permite ejecutar operaciones matemáticas. En concreto con abs() obtenemos la parte absoluta (positiva) de un número (en España, getTimezoneOffset devuelve siempre un número negativo).

Si restamos el resultado de la diferencia en horas entre los dos eventos, obtenemos el espacio que necesitamos para alinear la fecha actual con la fecha de nuestro evento: lo hacemos con setHours().

NOTAExisten diversas funciones que nos permiten elaborar un número con el objeto Math:•abs(): devuelve el valor absoluto de un número.•acos(): devuelve el arcocoseno en radianes.•asin(): devuelve el arcoseno en radianes.•atan(): devuelve el arcotangente como valor numérico comprendido entre ¬Π/2 y Π/2 radianes.•atan2(): devuelve el arcotangente del cociente de sus argumentos.•ceil(): devuelve el valor de su argumento redondeando por exceso al entero más cercano.•cos(): devuelve el coseno expresado en radianes.•exp(): devuelve el valor de e elevado al valor pasado como argumento.•floor(): devuelve el valor de su argumento redondeado por defecto al entero más cercano.•log(): devuelve el logaritmo natural en base e del número pasado como argumento.•max(): devuelve el valor máximo entre los argumentos que le han pasado.•min(): devuelve el valor mínimo entre los argumentos que le han pasado.•pow(): devuelve el valor del primer argumento pasado, elevado al valor del segundo argumento.•random(): devuelve un número aleatorio comprendido entre 0 y 1.•round(): devuelve su argumento redondeado al entero más cercano.•sin(): devuelve el seno expresado en radianes.•sqrt(): devuelve la raíz cuadrada.•tan(): devuelve la tangente.

Cuando las fechas se indican en la misma referencia horaria, con una instrucción if configuramos los mensajes que la función debe devolver: si el evento es posterior a hoy, es decir, su fecha es mayor que la fecha actual, el mensaje contendrá el número de días que faltan para el event; si no, indicará que la fecha ya ha pasado.

if (fechaEvento > hoy) {return `Faltan ${(fechaEvento.getTime() - hoy.getTime()) / milsegEnUnDia} días a ${NombreEvento}`;} else {return 'La fecha ya pasó'}

En nuestro ejemplo, hemos pasado a la función los valores (año-mes-día) para construir una fecha, pero nada nos impide pasar a la función directamente un objeto fecha:

<script type="text/javascript">function cuantosDias(fecha, evento) {let hoy = new Date();const milsegEnUnDia = 1000 * 60 * 60 * 24hoy.setHours(0, 0, 0, 0);const diferenciaHoras = Math.abs(fecha.getTimezoneOffset() / 60) - Math.abs(hoy.getTimezoneOffset() / 60);hoy.setHours(hoy.getHours() - diferenciaHoras);if (fechaEvento > hoy)return `Faltan ${(fecha.getTime() - hoy.getTime()) / milsegEnUnDia} días para ${evento}`;elsereturn 'La fecha ya pasó'}const fechaEvento =new Date(2017, 11, 25);document.getElementById('output').innerHTML = cuantosDias(fechaEvento, 'Navidad');</script>

Puedes encontrar este ejemplo en el archivo FuncionesParametros2 .html

JavaScript: Guía completa

Подняться наверх