Can any one help me about javascript functional programming? How the code runs below?

var sum = function(n1, n2) {//This is just a function
    return n1 + n2;
};
sum(1,2);//3
function makeSumN(n) {//This is a higher-order function
    return function(p) {
        sum(n, p)
   }
}
var sum1 = makeSumN(1);
sum1(2); //3
function makeMoreThanSum(f) {//This is a higher-order function
   return function(n1, n2) {
       sum(f(n1), n2)
   }
}
var sumSquareOfFirst = makeMoreThanSum(function(n){
    return n*n;
});
sumSquareOfFirst(2,1);//5

Does it help to know that the sum1 function ends up being the equivalent of:

return function(p) {
    sum(1, p)
}
1 Like

Perhaps this will make it a little clearer:

FunctionName Expects Returns Notes
sum 2 numbers a number
makeSumN a number a function
sum1 a number a number Generated by makeSumN
makeMoreThanSum a function a function
sumSquareOfFirst two numbers a number Generated by makeMorethanSum
(Lambda) a number a number The function inside the invocation of makeMoreThanSum in the defining line for sumSquareOfFirst.
1 Like

Thanks Paul_Wilkins,I understand first part of the program,but when I look the later part it is getting hard to me.

Thanks a lot m_hutley :slight_smile:
Though firstly it takes a lot time to understand to me, your explanation is really good.

With which specific code does your understanding start to become fuzzy?

The hard type of code for me is:

function makeMoreThanSum(f) {//This is a higher-order function
   return function(n1, n2) {
       sum(f(n1), n2)
   }
}

firstly I don’t get how the inner side of function sum call another func , but now I can understand all… :slight_smile:

Does it help to know that the returned function, retains knowledge of variables from its parent?

MDN has a good piece about Closure, which is the name for the technique.

1 Like

It is quite a tangle. I have worked through each of the two groups of functions line-by-line so that might aid you in understanding the logic.

To make it easier to follow I have named three of the internal functions at lines 6, 17 and 21 as AA, BB, CC.
The path through the functions is shown below the code

1: function sum(n1, n2) {
2: return n1 + n2;
3: };
4:
5: function makeSumN(n) {
6: return function AA( p ) {
7: return sum(n, p);
8: };
9: }
10:
11: var sum1=makeSumN(5);
12: var result=sum1(2);
13: console.log(result);
14: // ---------
15:
16: function makeMoreThanSum(f) {
17: return function BB(n1, n2) {
18: return sum(f(n1), n2);
19: };
20: }
21: var sumSquareOfFirst = makeMoreThanSum(function CC(n){ return n*n; });
22:
23: var result2=sumSquareOfFirst(2,1);
24: console.log(result2);

First group from line 1 to line 13

  • var sum1=makeSumN(5);
  • calls fn makeSumN, passes parameter n=5
  • returns inner function AA to sum1
  • sum1 is now equivalent to function AA ( p ) {return sum(n, p); };
  • var result =sum1(2) passes parameter to fn AA as p=2.
  • fn AA still has access to the variables of the outer fn through closure so n=5
  • fn AA calls fn sum and passes parameters n=5 and p=2 to n1 and n2.
  • fn sum returns n1+n2 = 7 to result
  • console.log(result)=7.

//
Second group from line 16 - line 24 plus fn sum at lines 1-3

  • var result2=sumSquareOfFirst(2,1);
  • calls sumSquareOfFirst which is equivalent to fn makeMoreThanSum and passes it fn CC(n)
  • makeMoreThanSum returns inner fn BB to sumSquareOfFirst.
  • now sumSquareOfFirst=function BB(n1, n2) { return sum(f(n1), n2); };
  • fn BB now runs with the passed parameters of n1=2 and n2=1 stored in local scope
  • now sumSquareOfFirst=sum(f(n1), n2), the returned value
  • sum is called and f(n1), which is fn CC, is evaluated and returns n1*n1=4
  • sum(n1,n2) then becomes sum(4,1){ return 4+1; }
  • result2=5.

Rather a messy way to explain it, but it works. :grinning:

1 Like

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.