Working our way backwards from solution to problem, we define an applicative functor, then use it to apply a function of multiple arguments.

For example we have this line of code:

const res = Box(x => x +1).ap(Box(2))// Box(3);

We want to use a funciton 'ap' (apply) on Box. And x will be 2.

To define 'ap' function.

const Box = x =>({  chain: f => f(x),  ap: other => other.map(x),  map: f => Box(f(x)),  fold: f => f(x),  inspect: () => `Box(${x})`})

So '

Box(x => x +1).ap(Box(2))

'

Can be translated to:

Box(2) => Box(2).map(x => x + 1);

This can be useful when apply curry function:

const res = Box(x => y => x + y).ap(Box(1)).ap(Box(2));console.log(res.inspect()); //Box(3)

after apply .ap(Box(1)), it becomes to:

Box(y => 1 +y).ap(Box(2))

after apply .ap(Box(2)), it becomes to:

Box(1 +2 )

It ends up, we have a function and continue to using 'ap':

const add = x => y => x + y;const res = Box(add).ap(Box(1)).ap(Box(2));

This partten is called click-functor!

The rule is:

F(val).map(fn) === F(fn).ap(F(val))

For example now we have:

const liftA2 = (fn, Fx, Fy) =>   F(fn).ap(Fx).ap(Fy);

The problem is we don't know what 'F' it is here...

So what we can do is transform accorind to the rule we have:

const liftA2 = (fn, Fx, Fy) =>   Fx.map(fn).ap(Fy)

Therefore we don't need to memtion any Functor.

Example:

const res2 = liftA2(add, Box(1), Box(2));console.log(res2.inspect()); //Box(3)