Una función es un bloque de código organizado y reutilizable que se usa para realizar alguna acción. Hay varias maneras de definir funciones en JavaScript. Aquí veremos las declaraciones de función y las expresiones de función. Otras posibilidades, como las funciones flecha, se tratarán en otros conceptos.
La forma estándar de definir una función en JavaScript es una declaración de función, también llamada definición de función o instrucción de función.
Consta de la palabra clave function, el nombre de la función y una lista de parámetros separados por comas y encerrada entre paréntesis.
A continuación viene el cuerpo de la función (el conjunto de instrucciones que define lo que hace una función), encerrado entre llaves.
function someName(param1, param2, param3) {
// ...
}
En JavaScript, una función se invoca (se llama) escribiendo el nombre de la función seguido de unos paréntesis que contienen los argumentos.
someName(arg1, arg2, arg3);
Escribir únicamente el nombre de la función no llama a la función en JavaScript.
function sayHello() {
console.log('Hello, World!');
}
sayHello;
// => [Function: sayHello]
// The text representations varies between environments.
sayHello();
// => 'Hello, World!'
Cuando trabajes con parámetros dentro del cuerpo de la función, ten en cuenta los posibles efectos secundarios sobre el valor original que se pasó a la función. En JavaScript, un argumento es una copia de una referencia al valor original. Lo que esto significa en la práctica depende del tipo de dato del argumento.
Los valores de los tipos de datos primitivos son inmutables. Todas las «modificaciones» crean siempre un nuevo valor primitivo. Por eso, el valor original nunca se ve afectado por lo que le ocurra al argumento dentro del cuerpo de la función.
const num = 0;
function increase(number) {
number = number + 1;
}
increase(num);
num;
// => 0
Es distinto para valores como los objetos, los arrays y las funciones. Como se copia la referencia, una reasignación no afectará al valor original. Sin embargo, dado que estás tratando con una copia superficial, modificar el argumento dentro del cuerpo de la función también cambiará el valor original que se pasó.
const nums = [0, 1, 2, 3, 4];
function pushFive(arr) {
arr.push(5);
}
pushFive(nums);
nums;
// => [0, 1, 2, 3, 4, 5]
De forma predeterminada, todos los parámetros definidos en la declaración de función son opcionales en JavaScript.
Si a una función se le pasan menos argumentos que parámetros, los argumentos que falten serán undefined dentro del cuerpo de la función; consulta Null y Undefined.
En muchos casos, tiene más sentido inicializar un parámetro con un valor predeterminado si no se pasa ningún valor ni la propiedad undefined.
Esto puede hacerse especificando parámetros predeterminados directamente en la definición de la función.
function someName(param1 = defaultValue1, param2 = defaultValue2) {
// ...
}
Una función puede invocarse (llamarse) con más argumentos que parámetros había en la definición de la función. Todos los argumentos, incluidos esos argumentos de más, se pueden encontrar en el «array» arguments.
También es posible definir funciones que aceptan un número arbitrario de argumentos (funciones variádicas); consulta los parámetros rest en Operadores Rest y Spread para más detalles.
return
Una instrucción return pone fin a la ejecución de la función y especifica un valor que se devolverá a quien llamó a la función. Una función puede tener varias instrucciones return.
function checkNumber(num) {
if (num === 0) {
return 'You passed 0, please provide another number.';
}
return 'Thanks for passing such a nice number.';
}
El resultado de una función que no devuelve ningún valor con return o que no tiene una instrucción return es undefined.
En JavaScript no hay return implícitos.
function nakedReturn(a) {
a * 2;
return;
}
nakedReturn(1);
// => undefined
function noReturn(a) {
a * 2;
}
noReturn(1);
// => undefined
En JavaScript, solo puedes devolver exactamente un valor. Si quieres transmitir más información, primero tienes que combinarla en una sola entidad, normalmente en un objeto o en un array.
function divide(a, b) {
return {
quotient: Math.floor(a / b),
remainder: a % b,
};
}
Una declaración de función es una instrucción independiente. Pero a veces resulta útil definir una función como parte de otra expresión, por ejemplo, en una asignación, como parámetro de función (callback) o como valor de un objeto. Esto puede hacerse con una expresión de función. Tiene la misma sintaxis que una declaración de función, solo que se puede omitir el nombre de la función para crear una función anónima.
const someFunction = function (param) {
// ...
};
someOtherFunction(function (param) {
// ...
});
const obj = {
someFunction: function (param) {
// ...
},
};
Una función introduce un nuevo contexto de ejecución en JavaScript. Las variables definidas dentro de una función no son accesibles fuera de esa función. Pero las variables definidas en el scope padre (el scope donde se definió la propia función) sí son accesibles dentro de la función. La documentación de MDN sobre scope muestra ejemplos de este comportamiento.
Echa un vistazo a los closures para saber más sobre el scope de las variables en JavaScript.