Patrón de encadenamiento de métodos

Parte de la sección Programación Orientada a Objetos del Journey de JavaScript de Coddy — lección 16 de 56.

El encadenamiento de métodos es un patrón de programación que permite llamar a múltiples métodos en el mismo objeto en una sola sentencia. Cada método devuelve el objeto en sí mismo (this), lo que permite llamar al siguiente método en la misma línea.

Crea un objeto contador simple:

const counter = {
  count: 0,
  
  increment() {
    this.count++;
    return this;
  },
  
  decrement() {
    this.count--;
    return this;
  },
  
  getValue() {
    return this.count;
  }
};

Ahora puedes encadenar métodos:

// Encadenar múltiples operaciones
counter.increment().increment().decrement();

// El contador ahora es 1
console.log(counter.getValue()); // Salida: 1

La clave para el encadenamiento de métodos es devolver this desde cada método que desees que sea encadenable.

Desafío

Se te proporciona un objeto calculator que ya tiene los métodos add() y subtract(). Tu tarea es agregar los métodos multiply y divide que devuelvan this para permitir el encadenamiento.

Hoja de referencia

El encadenamiento de métodos le permite llamar a múltiples métodos en el mismo objeto en una sola sentencia. Cada método devuelve el objeto en sí mismo (this), lo que permite que el siguiente método sea llamado en la misma línea.

Para habilitar el encadenamiento de métodos, devuelva this desde cada método:

const counter = {
  count: 0,
  
  increment() {
    this.count++;
    return this;
  },
  
  decrement() {
    this.count--;
    return this;
  },
  
  getValue() {
    return this.count;
  }
};

Encadene múltiples métodos juntos:

counter.increment().increment().decrement();
console.log(counter.getValue()); // Output: 1

Pruébalo tú mismo

import { calculator } from './calculator.js';

// Código de prueba - no modificar
const result1 = calculator.add(10).multiply(2).getValue();
console.log(result1); // Debería mostrar 20

// Reiniciar para la segunda prueba
calculator.value = 0;
const result2 = calculator.add(20).divide(4).subtract(1).getValue();
console.log(result2); // Debería mostrar 4