Funciones JavaScript
Una función de JavaScript es un bloque de código diseñado para realizar una tarea en particular.
Una función de JavaScript se ejecuta cuando "algo" la invoca (lo llama).
Ejemplo
function myFunction(p1, p2) {
return p1 * p2;
// The function returns the product of p1 and p2
}
Sintaxis de funciones de JavaScript
Una función de JavaScript se define con la functionpalabra clave, seguida de un nombre , seguido de paréntesis () .
Los nombres de funciones pueden contener letras, dígitos, subrayados y signos de dólar (las mismas reglas que las variables).
Los paréntesis pueden incluir nombres de parámetros separados por comas:
( parámetro1, parámetro2, ... )
El código a ejecutar, por la función, se coloca entre corchetes: {}
function
name(parameter1, parameter2, parameter3) {
// code to be executed
}
Los parámetros de la función se enumeran entre paréntesis () en la definición de la función.
Los argumentos de la función son los valores recibidos por la función cuando se invoca.
Dentro de la función, los argumentos (los parámetros) se comportan como variables locales.
Una función es muy similar a un procedimiento o una subrutina, en otros lenguajes de programación.
Invocación de función
El código dentro de la función se ejecutará cuando "algo" invoque (llame) a la función:
- Cuando ocurre un evento (cuando un usuario hace clic en un botón)
- Cuando se invoca (llama) desde código JavaScript
- Automáticamente (auto invocado)
Aprenderá mucho más sobre la invocación de funciones más adelante en este tutorial.
Retorno de función
Cuando JavaScript llega a una returndeclaración, la función dejará de ejecutarse.
Si la función se invocó desde una declaración, JavaScript "regresará" para ejecutar el código después de la declaración de invocación.
Las funciones suelen calcular un valor de retorno . El valor de retorno se "devuelve" a la "persona que llama":
Ejemplo
Calcula el producto de dos números y devuelve el resultado:
let x = myFunction(4, 3); // Function is called, return value will end up in x
function myFunction(a, b) {
return a * b;
// Function returns the product of a and b
}
El resultado en x será:
12
¿Por qué funciones?
Puede reutilizar el código: defina el código una vez y utilícelo muchas veces.
Puede usar el mismo código muchas veces con diferentes argumentos para producir resultados diferentes.
Ejemplo
Convertir Fahrenheit a Celsius:
function toCelsius(fahrenheit) {
return (5/9) * (fahrenheit-32);
}
document.getElementById("demo").innerHTML = toCelsius(77);
El operador () invoca la función
Usando el ejemplo anterior, toCelsiusse refiere al objeto de la función y
toCelsius()se refiere al resultado de la función.
Acceder a una función sin () devolverá el objeto de la función en lugar del resultado de la función.
Ejemplo
function toCelsius(fahrenheit) {
return (5/9) * (fahrenheit-32);
}
document.getElementById("demo").innerHTML = toCelsius;
Funciones utilizadas como valores de variables
Las funciones se pueden usar de la misma manera que se usan las variables, en todo tipo de fórmulas, asignaciones y cálculos.
Ejemplo
En lugar de usar una variable para almacenar el valor de retorno de una función:
let x = toCelsius(77);
let text = "The temperature is " + x + " Celsius";
Puede usar la función directamente, como un valor variable:
let text = "The temperature is " + toCelsius(77) + " Celsius";
Aprenderá mucho más sobre las funciones más adelante en este tutorial.
Variables locales
Las variables declaradas dentro de una función de JavaScript se vuelven LOCALES para la función.
Solo se puede acceder a las variables locales desde dentro de la función.
Ejemplo
// code here can NOT use carName
function myFunction() {
let carName = "Volvo";
// code here CAN use carName
}
// code here can NOT use carName
Dado que las variables locales solo se reconocen dentro de sus funciones, las variables con el mismo nombre se pueden usar en diferentes funciones.
Las variables locales se crean cuando se inicia una función y se eliminan cuando se completa la función.