Compose javascript functions with more than one argument

Question

How can I convert this function composition into more readable format?

funcA(argumentA, funcB(argumentA, funcC(argumentA, argumentB)))

What I'd like to achieve is something more like this:

compose(funcC, funcB, funcA)(argumentA, argumentB)

I'm using this compose function implementation:

const compose = (...fns) => fns.reduce((f, g) => (...args) => f(g(...args)))

The problem is I need argumentA in all function calls as a first parameter and every function returns a value to be passed as a second parameter to the next function. I know I could create separate function-returning functions and use them like so:

compose(funcCWithArg(argumentA), funcBWithArg(argumentA), funcAWithArg(argumentA))(argumentB)

but in my actual case there aren't only three of them, but many more and that would require some serious amount of code just to write them down. Is there a simpler way to do that?

EDIT: I can't use any external library. Only vanilla js.

Ramdajs has a function that does that ramdajs.com/docs/#compose — user93
– user93, Commented Jun 19, 2017 at 8:20
@user93 From the docs you provided: "The rightmost function may have any arity; the remaining functions must be unary.". So that's not solving my problem. I need two parameters in every function. — zorza
– zorza, Commented Jun 19, 2017 at 8:28
@zorza compose partially applied functions with a prebound first argument. — zerkms
– zerkms, Commented Jun 19, 2017 at 8:30
@zerkms That's the solution I want to avoid if possible as I stated in the question. — zorza
– zorza, Commented Jun 19, 2017 at 8:32
@zorza First of all, this isn't function composition in the original sense anymore. Sure, you could create your own combinator to avoid the nested structure. However, this would disguise the control flow and make the code hard to read. The only reason why you would do this is to remain DRY. I doubt that you will need this combinator often, though. So either use partially applied functions or write the function calls manually. — user6445533
– user6445533, Commented Jun 19, 2017 at 10:27

Chitharanjan Das · Accepted Answer · 2017-06-19 09:00:45Z

3

Using vanilla JS,

const compose = (...fns) => (arg1, arg2) => fns.reduce((arg, f) => f(arg1, arg), arg2);

Explanation

compose becomes a function returning a function, which loops through the list of functions passed to it, passing the first argument to every function call.

Test

const sum = (a, b) => (a + b);
const mult = (a, b) => (a * b);
compose(sum, mult)(2, 3) === mult(2, sum(2, 3));  // true

edited Jun 19, 2017 at 9:00

answered Jun 19, 2017 at 8:50

Chitharanjan Das

1,35310 silver badges15 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Scott Sauyet · Accepted Answer · 2017-06-19 15:46:09Z

2

It's not hard to write a function like this:

const link = (...fns) => (a, ...args) =>
    fns.slice(1).reduce((val, fn) => fn(a, val), fns[0](a, ...args));

If you wanted it to be robust enough to handle errors gracefully, it would take more. But this should be a start.

You would use it like this:

const funcA = (x, y) => `funcA(${x}, ${y})`;
const funcB = (x, y) => `funcB(${x}, ${y})`;
const funcC = (x, y) => `funcC(${x}, ${y})`;

link(funcA, funcB, funcC)('argumentA', 'argumentB');
//=> "funcC(argumentA, funcB(argumentA, funcA(argumentA, argumentB)))"

You can see this in action on Runkit.

(And obviously you can do a reverse if you want the opposite argument order.)

answered Jun 19, 2017 at 15:46

Scott Sauyet

50.9k5 gold badges57 silver badges111 bronze badges

Comments

user94559 · Accepted Answer · 2017-06-19 08:52:18Z

First create new functions that are partial applications using bind. Then use the compose function you already have:

const funcA = (x, y) => `A(${x}, ${y})`;
const funcB = (x, y) => `B(${x}, ${y})`;
const funcC = (x, y) => `C(${x}, ${y})`;

const compose = (...fns) => fns.reduce((f, g) => (...args) => f(g(...args)));
const partials = (...fns) => (...args) => fns.map((f) => f.bind(this, ...args));

console.log(compose(...partials(funcA, funcB, funcC)("a"))("b"));

// Output:
// A(a, B(a, C(a, b)))

UPDATE

You can also build a single function that composes the partials with the first argument passed and then calls them with the other arguments. (I think this is what you want? I wasn't 100% sure what to do with more than two arguments.)

const partialCompose = (...fns) => (...args) => compose(...partials(...fns)(args[0]))(...args.slice(1));

console.log(partialCompose(funcA, funcB, funcC)("a", "b")); // same output as above

Collectives™ on Stack Overflow

Compose javascript functions with more than one argument

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related