JavaScript Funciones
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 (la llama).
Ejemplo
function myFunction(p1, p2) {
return p1 * p2; // La función devuelve el producto de p1 y p2
}
Try it Yourself »
Sintaxis de la función JavaScript
Una función JavaScript se define con la palabra clave function
, seguida de un nombre, seguido de paréntesis ().
Los nombres de funciones pueden contener letras, dígitos, guiones bajos 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 que ejecutará la función se coloca entre llaves: {}
function nombre(parámetro1, parámetro2, parámetro3) {
// código a ejecutar
}
Los parámetros de la función se enumeran dentro de los paréntesis () en la definición de la función.
Los argumentos de la función son los valores que recibe la función cuando se la 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 se produce un evento (cuando un usuario hace clic en un botón)
- Cuando se invoca (llama) desde el código JavaScript
- Automáticamente (autoinvocada)
Aprenderá mucho más sobre la invocación de funciones más adelante en este tutorial.
Retorno de función
Cuando JavaScript alcanza una declaración return
, 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 que la invocó.
Las funciones a menudo calculan un valor de retorno. El valor de retorno se "devuelve" al "invocador":
Ejemplo
Calcular el producto de dos números y devolver el resultado:
let x = myFunction(4, 3); // Se llama a la función y el valor de retorno terminará en x
function myFunction(a, b) {
return a * b; // La función devuelve el producto de a y b
}
El resultado en x será:
12
¿Por qué usar funciones?
Puede reutilizar el código: defina el código una vez y úselo 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);
Try it Yourself »
El operador () invoca la función
Usando el ejemplo anterior, toCelsius
hace referencia al objeto de la función, y toCelsius()
hace referencia al resultado de la función.
Si se accede a una función sin () se 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;
Try it Yourself »
Funciones utilizadas como valores de variables
Las funciones se pueden utilizar de la misma forma que las variables, en todo tipo de fórmulas, asignaciones y cálculos.
Ejemplo
En lugar de utilizar una variable para almacenar el valor de retorno de una función:
let x = toCelsius(77);
let text = "The temperature is " + x + " Celsius";
Puedes utilizar la función directamente, como valor variable:
let text = "The temperature is " + toCelsius(77) + " Celsius";
Try it Yourself »
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
// El código aquí NO se puede usar carName
function myFunction() {
let carName = "Volvo";
// El código aquí PUEDE usarse carName
}
// El código aquí NO se puede usar carName
Try it Yourself »
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.