Una función de JavaScript es un bloque de código diseñado para realizar una tarea particular. Una función de JavaScript se ejecuta cuando "algo" la invoca (la llama).
Ejemplo:
// Function to compute the product of p1 and p2
function myFunction(p1, p2) {
return p1 * p2;
}
Sintaxis de funciones de JavaScript
Una función de 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, 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 llaves: {}
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 que recibe la función cuando se invoca.
Dentro de la función, los argumentos (los parámetros) se comportan como variables locales.
Invocación de una función
El código dentro de la función se ejecutará cuando "algo" invoque (llame) la función:
Cuando ocurre un evento (cuando un usuario hace clic en un botón)
Cuando se invoca (llama) desde el código JavaScript
Automáticamente (autoinvocado)
Aprenderá mucho más sobre la invocación de funciones más adelante en este tutorial.
Función de retorno
Cuando JavaScript llega a una declaración return
, la función dejará de ejecutarse.
Si la función se invocó desde una declaración, JavaScript "volverá" a ejecutar el código después de la declaración que lo invocó.
Las funciones suelen calcular un valor de retorno. El valor de retorno se "devuelve" a la que "invocó":
Ejemplo:
Calcula el producto de dos números y devuelve el resultado:
// Function is called, the return value will end up in x
let x = myFunction(4, 3);
function myFunction(a, b) {
// Function returns the product of a and b
return a * b;
}
¿Por qué funciones?
Con funciones puedes reutilizar código
Puedes escribir código que pueda usarse muchas veces.
Puedes utilizar el mismo código con diferentes argumentos para producir resultados diferentes.
El operador ()
El operador ()
invoca (llama) a la función:
Ejemplo:
Convertir Fahrenheit a Celsius:
function toCelsius(fahrenheit) {
return (5/9) * (fahrenheit-32);
}
let value = toCelsius(77);
Acceder a una función con parámetros incorrectos puede devolver una respuesta incorrecta:
Ejemplo:
function toCelsius(fahrenheit) {
return (5/9) * (fahrenheit-32);
}
let value = toCelsius();
Acceder a una función sin ()
devuelve la función y no el resultado de la función:
Ejemplo:
function toCelsius(fahrenheit) {
return (5/9) * (fahrenheit-32);
}
let value = toCelsius;
Nota: Como puedes ver en los ejemplos anteriores,
toCelsius
se refiere al objeto de función ytoCelsius()
se refiere al resultado de la función.
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 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 usar la función directamente, como valor de variable:
Ejemplo:
let text = "The temperature is " + toCelsius(77) + " Celsius";
Aprenderás 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 sólo se reconocen dentro de sus funciones, las variables con el mismo nombre se pueden utilizar en diferentes funciones.
Las variables locales se crean cuando se inicia una función y se eliminan cuando se completa la función.
Traducido con 💚 desde W3Schools.com