Encadeamento de funções com JavaScript

11d atrás

Ion

---

0 0

Imagine ter que chamar várias funções, uma utilizando o resultado obtido pela outra, como nesse exemplo a seguir:

function double(number) {
	return number * 2;
}

function add(number, add) {
	return number + add;
}

function subtract(number, sub) {
	return number - sub;
}

subtract(add(double(double(double(2))), 5), 1); // 20

Isso pode causar um código confuso e com baixa legibilidade. Para contornar isso, vamos reescrever o código utilizando encadeamento de funções.

O encadeamento de funções é possível quando uma função retorna seu próprio objeto de instância, e com esse objeto, podemos chamar diretamente outras, ou a mesma função de uma classe ou objeto.

Então, reescrevendo as funções acima, para conseguir esse feito, ficaria assim:

class Calc {
	constructor(number) {
		this.number = number;
	}

	double() {
		this.number = this.number * 2;
		
		return this;
	}

	add(add) {
		this.number = this.number + add;
		return this;
	}

	subtract(sub) {
		this.number = this.number - sub;
		
		return this;
	}
}

Agora, é só instanciar um objeto, e chamar seus métodos de forma encadeada:

const calc = new Calc(2);

calc.double().double().double().add(5).subtract(1).number; // 20