JavaScript function can have inner functions, means we can write a function within a function and so on. We can have any level of nested functions within a function. This gives JavaScript an advantage of hiding implementation. Also, it gives us the capability of closure. Javascript function can also return that inner function. which means we can reference them from outside.
currySumFunc is a funcion curry pattern in the below example.
function simpleSumFunc(a, b) {
return a + b
}
function currySumFunc(a) {
return function(b) {
return a + b
};
}
simpleSumFunc(1, 2);//output: 3
currySumFunc(1)(2);//output: 3
Let say- we have a parent function which has an inner child function. When we invoke the parent function, it returns the child function. We get the child function reference in return. Now we can invoke the child function from outside anytime later.
function parent() {
var a = 10;
return child() {
console.log('child remembers a= ', a);
};
}
var childRef = parent();
childRef() //Output: child remembers a= 10
Alternatively, we can execute the child function directly. In the above example, we can see that parent function returns an inner function. So, instead of storing the returned function reference in a variable and invoke it later, we can directly invoke the inner (child) function.
parent()(); //Output: child remembers a= 10
In the above example you can see, we used another set of parentheses to invoke child function. This pattern is called function currying. This is a very strong pattern in javascript and it makes the programming more fun.
#Example 1
function sum(a){
return function child(b){
if(b){
return sum(a + b);
}
return a;
}
}
#Example 2
var sum = a => b => {
if(b){
return sum(a + b);
}
return a;
}
#Example 3
var sum = a => b => b ? sum(a + b) : a;
sum(1)(2)(); //Output: 3
sum(1)(2)(3)(); //Output: 6
sum(1)(2)(3)(4)(); //Output: 10
In the above code snippet #Example 1, 2 and 3 all are same. It is just that I have used shorthand arrow function for #Example 2 and 3. #Example 2 and 3 is javascript currying using ES6. It is a simple sum function where we can pass any number of argument using curry pattern.
Suppose, we want to return the square of the sum. We can create a separate function to calculate square and pass it to function curry, we can modify the sum function a bit to accommodate the change.
function square(num){
return num * num;
}
function sum(a){
return function child(b){
if(typeof b === "number"){
return sum(a + b);
} else if(typeof b === "function"){
// b is callback funnc here
return b(a);
}
return a;
}
}
sum(1)(2)(square) //output: 9
sum(1)(2)(4)(square)//output: 49
Now, if I pass empty braces at the end, it returns the sum of all the numbers. And if pass square function at the end, it returns the square value of the sum.
Above function is a function curry pattern which can take infinite no of arguments and return either sum of all the numbers, or you can pass a callback function to process the result before returning.
When to use function curry?
When you encounter and understand this pattern for the first time the question comes to your mind- where and when can I use function curry? You will get this answer once you use this functional language for a while. You will understand the different patterns over time. But to answer this question - We can use function curry when we want to hide the data and its implementation from outside. Function currying alone is not of much help. We can use higher-order-function with curry to make it more usable, scalable ad robust. We can segregate the logic which will be easier to maintain and scale.
Advantages of currying in javascript:
By using function curry pattern we can execute a function in steps instead of executing the function at once. We can hide the implementation from outside.
With the combination of a higher-order-function, we can make it reusable and much easier to refactor. In the last example- we were able to calculate
the square of the sum of all numbers. We can simply pass a cube method as callback instead square which will return the cube of the
sum of all numbers.
function cube(num){
return num * num * num;
}
.......
........
sum(1)(2)(square) //output: 9
sum(1)(2)(cube) //output: 27
0 Comments