## DEV Community π©βπ»π¨βπ» is a community of 963,864 amazing developers

We're a place where coders share, stay up-to-date and grow their careers.

Kurapati Mahesh

Posted on • Updated on

# Javascript: Functional Composition

It is an approach where result of one function passed on to next function.

``````const add = (x, y) => x+y;

const subtract = (x) => x-4;

const multiply = (x) => x * 8;

// result of `add` is passed to `subtract` and its result passed to `multiply`.

result;
> 8
``````

That looks readable but what if we have more functions to call one after other.
Let's try little cleaner approach.

``````const compose = (...functions) => x => functions.reduceRight((total, f) => f(total), x);

const add = x => x+2;

const subtract = x => x-1;

const multiply = x => x * 8;

> 24
``````

We can also use reduce to implement:

``````const pipe = (...functions) => x => functions.reduce((total, f) => f(total), x);

const add = x => x+2;

const subtract = x => x-1;

const multiply = x => x * 8;

`pipe` - performs from left-to-right.
`compose` - performs from right-to-left.