undefinedschool / notes-functions-first-class

Notas sobre funciones First-Class

👉 Ver todas las notas

Contenido

• Intro
• Alto orden!
• ¿Por qué podemos tratar a las funciones como cualquier otro valor?
• Ejemplos
  • Asignar una función a una constante/variable
  • Pasar una función por parámetro
  • Retornar una función
  • Como propiedades de un objeto,aka métodos
  • Array de funciones
  • Usando IIFEs
  • Usando el constructor Function

Intro

Un lenguaje de programación tiene First-Class functions cuando las funciones puede ser tratadas como cualquier otro valor. Es decir, podemos:

• Asignarlas como valores a una variable o constante

• Recibirlas como parámetro (callbacks) ⭐

• Retornar funciones ⭐

• El truco es olvidarte por un rato que estás tratando con funciones, pensá que se trata de un valor cualquiera, como un number, string ó booleany qué cosas podés hacer con este.

Alto orden!

Las características anteriores, marcadas con ⭐ hacen que una función sea además lo que se conoce como función de alto orden ó Higher Order Function 😎

Para más detalles, ver MDN: First Class Function

¿Por qué podemos tratar a las funciones como cualquier otro valor?

Porque las funciones en JS... son objetos!

Ejemplos

Asignar una función a una constante/variable

Un valor cualquiera puede ser guardado en una variable/constante. ¡Una función también! 😸

Cuando asignamos una función a una variable ó constante, la llamamos function expression

// assign a number to a constant
const theNumberOfTheBeast = 666;

// assign a function to a constant
const fn = function() {
  console.log(I'm a function expression! 😎`);
}

fn();

Pasar una función por parámetro

const numbers = [1, 2, 3, 4, 5];

// .map() method receives a function as a parameter (callback)
numbers.map(number => number ** 2); // => [1, 4, 9, 16, 25]

Retornar una función

function hof(fn) {
  return fn;
}

Como propiedades de un objeto,aka métodos

const hero = {
  name: 'Jessica Jones',
  quote: () => console.log(`There's dirt everywhere... you just have to know where to look`)
};

hero.quote();

Array de funciones

Si un array puede guardar valores de cualquier tipo, entonces también podemos guardar funciones, no? Obvio 🎉 (alguien dijo React Hooks? 😛)

const functionsList = [() => console.log('Hello'), (a, b) => a + b];

functionsList[0]();       // 'Hello'
functionsList[1](3, -27); // => -24

// running all of them
for (const fn of functionsList) {
  fn(1, 3);
}

Usando IIFEs

Podemos crear funciones e invocarlas inmediatamente

console.log(7 + 21);                            // 28
console.log(7 + (function() { return 21; })()); // => 28

Usando el constructor Function

Las funciones en JavaScript son objetos, por lo que pueden crearse como cualquier otro

const sum = new Function('a', 'b', 'return a + b');

console.log(sum(2, 6)) // => 8;