Closures. ¿Qué son exactamente?

¿Alguna vez has oído hablar de los closures en JavaScript? Si no, estás perdiéndote una de las características más poderosas del lenguaje. En este artículo, voy a explicar qué son los closures y cómo puedes utilizarlos para mejorar la legibilidad y la extensibilidad de tus funciones.

¿Qué es un closure en JavaScript?

En términos sencillos, un closure es una función que recuerda el estado de las variables en el momento en que fue creada, incluso después de que la función haya terminado de ejecutarse. Esto significa que puedes utilizar el closure para acceder a variables que ya no están en el scope actual.

Veamos un ejemplo para entenderlo mejor:

function createCounter() {
  let count = 0;

  return function() {
    count++;
    console.log(count);
  }
}

const counter = createCounter();

counter(); // 1
counter(); // 2
counter(); // 3

En este ejemplo, la función createCounter devuelve otra función que incrementa una variable count cada vez que se llama. La variable count se inicializa en 0 cuando se llama a la función createCounter. Luego, cuando se llama a la función devuelta, la variable count se actualiza y se imprime en la consola.

Lo interesante de este ejemplo es que la función devuelta mantiene una referencia al valor de count incluso después de que la función createCounter haya terminado de ejecutarse. Esto se debe a que la función devuelta es un closure que recuerda el valor de count en el momento en que se creó.

Cómo utilizar los closures para mejorar tus funciones
Puedes utilizar los closures para mejorar la legibilidad y la extensibilidad de tus funciones en JavaScript. Por ejemplo, puedes utilizar un closure para crear una función que acepte un argumento y luego devuelva otra función que lo utilice.

Veamos un ejemplo:

function createMultiplier(multiplier) {
  return function(number) {
    return number * multiplier;
  }
}

const double = createMultiplier(2);
const triple = createMultiplier(3);

console.log(double(5)); // 10
console.log(triple(5)); // 15

En este ejemplo, la función createMultiplier acepta un argumento multiplier y devuelve otra función que multiplica su argumento por el multiplier. Luego, podemos utilizar esta función para crear otras funciones que multipliquen por diferentes valores.

Ejemplos de closures en JavaScript

Veamos algunos ejemplos más de cómo puedes utilizar los closures en JavaScript.

Ejemplo 1: función que utiliza una variable fuera de su scope

function createLogger() {
  let messages = [];

  return function(message) {
    messages.push(message);
    console.log(messages);
  }
}

const logger = createLogger();

logger('Mensaje 1'); // ['Mensaje 1']
logger('Mensaje 2'); // ['Mensaje 1', 'Mensaje 2']

En este ejemplo, la función createLogger devuelve otra función que añade mensajes a un array cada vez que se llama. La variable messages se inicializa en un array vacío cuando se llama a la función createLogger. Luego, cuando se llama a la función devuelta, el mensaje se añade al array y se imprime en la consola. El array messages se mantiene en memoria gracias al closure y podemos seguir añadiendo mensajes al array cada vez que llamamos a la función devuelta.

Ejemplo 2: función que utiliza una variable privada

function createPerson(name) {
  let age = 0;

  return {
    getName() {
      return name;
    },
    getAge() {
      return age;
    },
    setAge(newAge) {
      age = newAge;
    }
  }
}

const person = createPerson('Juan');

console.log(person.getName()); // 'Juan'
console.log(person.getAge()); // 0

person.setAge(30);

console.log(person.getAge()); // 30

En este ejemplo, la función createPerson devuelve un objeto con tres métodos: getName, getAge y setAge. La variable name se utiliza para inicializar el nombre de la persona cuando se llama a la función createPerson. La variable age se inicializa en 0 y sólo puede ser modificada mediante el método setAge. Los métodos getName y getAge pueden acceder a la variable name y age gracias al closure.

Conclusión

Los closures son una característica poderosa de JavaScript que te permiten mejorar la legibilidad y la extensibilidad de tus funciones. Puedes utilizar los closures para crear funciones que mantengan el estado de las variables incluso después de que la función haya terminado de ejecutarse. Además, puedes utilizar los closures para crear funciones que acepten argumentos y devuelvan otras funciones que los utilicen.

Espero que este artículo te haya ayudado a entender mejor los closures en JavaScript y a utilizarlos en tus proyectos. Si tienes alguna pregunta o comentario, no dudes en dejarlo aquí abajo. ¡Gracias por leer!