La función arrow fue introducida en la versión ES6 de Javascript. Enseguida veremos con códigos de ejemplo cómo se definía una función antiguamente y las distintas formas de definir funciones arrow.
/*
Definición y ejecución de una función javascript antes
de las funciones arrow.
*/
function miFuncion() {
console.log('Hola');
}
miFuncion(); // "Hola"
Ahora veremos la misma función pero definida como función arrow. Observe que esta función no recibe parámetro alguno. En este caso no se pueden omitir los paréntesis y deben ir vacíos.
/*
Definición y ejecución de una función arrow javascript sin
parámetros.
*/
const miFuncion = () => {
console.log('Hola');
}
miFuncion(); // "Hola"
Si la función arrow sólo recibe un parámetro, se pueden omitir los paréntesis como se muestra en la segunda función del código siguiente:
/*
Distintas definiciones válidas de una función arrow cuando
la función recibe sólo un parámetro.
*/
const imprimeNombre = (nombre) => {
console.log(nombre);
}
const imprimeNombre2 = nombre => {
console.log(nombre);
}
imprimeNombre('Miguel'); // Miguel
imprimeNombre2('Luis'); // Luis
Cuando una función arrow recibe más de un parámetro los paréntesis son obligatorios.
/*
Cuando una función arrow recibe más de un parámetro
los paréntesis son obligatorios, no se pueden omitir.
*/
const imprimeEdadYNombre = (edad, nombre) => {
console.log(edad, nombre);
}
imprimeEdadYNombre(28, 'Armando'); // 28 "Armando"
Si la función regresa un valor (return) y no tiene más líneas de código puede ser escrita como se muestra en el siguiente código:
/*
Función que regresa un valor y no contiene más código.
*/
const doblaNumero = (numero) => {
return numero * 2;
}
console.log(doblaNumero(2)); // 4
/*
La función anterior puede escribirse de la siguiente
forma:
*/
const doblaNumero2 = (numero) => numero * 2;
console.log(doblaNumero2(2)); // 4
El último ejemplo es la forma más corta de escribir una función arrow.
Espero les sea útil esta entrada. Espero sus observaciones y comentarios.
¡Hasta pronto!