Functional programming has become very popular in recent times with one of its key concepts being Currying. In this article, we will explore what currying is, how it works in JavaScript and also its benefits to make the code look better and increase efficiency.<\/p>\n\n\n\n
Currying is a functional programming technique in JavaScript that transforms a function with multiple arguments into a series of functions, each taking a single argument.<\/strong><\/p>\n\n\n\n This function does not take all the arguments together, instead it takes them one by one. Currying transforms f(a,b) into f(a)(b). It helps to create a higher-order function and also the same variable is not passed again and again. <\/p>\n\n\n\n This allows for partial application, where a function can be partially applied even if it doesn’t have all the parameters, and the result is a new function that will expect remaining arguments. <\/p>\n\n\n\n Let’s take an example and then we will break the code line by line:<\/p>\n\n\n\n Now let’s break down the \u2018currySum\u2019 function step by step:<\/p>\n\n\n\n Here all the functions except the outer function are anonymous functions, meaning they don’t have a name assigned to them.<\/strong> <\/p>\n\n\n\n Anonymous functions are often used in cases where the function is short-lived or only relevant within a specific context, such as within another function. Since these functions are not called directly by name in the code, therefore they don’t need a specific name.<\/p>\n\n\n\n Though we have an option of giving names it will only make our code lengthy and will not add much value. However, in other situations where functions are reused or more complex, giving them names can enhance code readability and maintainability. <\/p>\n\n\n\n Let\u2019s see how we used currySum:<\/p>\n\n\n\n Output:<\/strong><\/p>\n\n\n\n currySum(2) returns a new function that expects one argument(y). Similarly, currySum(2)(3) returns another function that expects one argument(z). Then finally currySum(2)(3)(4) returns the result of adding 2+3+4.<\/p>\n\n\n\n Currying can also be implemented using arrow functions. Here\u2019s a simple code for the same:<\/p>\n\n\n\n Currying and partial application are different things, currying involves transforming a function with multiple arguments into a sequence of single-argument functions whereas in partial application it creates a new function with some arguments fixed, but it remains a regular function.<\/strong><\/p>\n\n\n\n Check the code below:<\/p>\n\n\n\n Output:<\/strong><\/p>\n\n\n\n Here bind is used to create a new function called partialApply. The first argument to \u2018bind\u2019 is the context in which the function will be executed. But if \u2018this\u2019 is not relevant or does not matter for the function sum, we can set it to null.<\/p>\n\n\n\n The subsequent arguments \u20182\u2019 and \u20183\u2019 fix the values of the first two parameters \u2018x\u2019 and \u2018y\u2019 in the original function. partialApply is now a new function with the values of \u2018x\u2019 and \u2018y\u2019 fixed. When we invoke partialApply, we are providing the remaining value of the parameter \u2018z\u2019.<\/p>\n\n\n\n The bind method is used to create a new function from the original function with specific arguments already filled in. This makes it convenient to reuse the partially applied function with different values for the remaining parameters.<\/p>\n\n\n\n currySum invokes each curried function individually whereas partialApply directly calls the partially applied function. Therefore currying is ideal for creating a chain of functions with single parameters, while partial application is suitable for fixing specific arguments.<\/p>\n\n\n\n Currying promotes modular code by breaking down functions into smaller, composable units.<\/strong> This helps in code reusability as these units can be easily combined in various ways.<\/p>\n\n\n\n It also facilitates partial application, which is valuable in scenarios where certain parameters are known first. <\/p>\n\n\n\n Other than that, it allows the creation of different versions of a function for different situations. Therefore by partially applying arguments, we can generate functions optimized for particular situations without duplicating code.<\/p>\n\n\n\n Here are some common mistakes developers make when implementing Currying in JavaScript:<\/p>\n\n\n\n But note that not all JavaScript tools or libraries support currying, you must be aware of potential compatibility issues and ensure your tools can handle curried functions appropriately. <\/p>\n\n\n\n\/\/original function with multiple parameters\nfunction sum(x,y,z){\n return x+y+z;\n}\n\n\/\/curried version of the 'sum' function\nfunction currySum(x){\n\n \/\/returns a function that takes 'y'\n return function(y){\n\n \/\/returns another function that takes 'z'\n return function(z){\n\n \/\/returns the sum of x,y, and z\n return x+y+z;\n };\n };\n}<\/pre><\/div>\n\n\n\n\n
\/\/ using currySum function\nconst curry = currySum(2)(3)(4)\nconsole.log(curry);<\/pre><\/div>\n\n\n\n
9<\/code><\/pre>\n\n\n\n\/\/currying\nconst currySum = x => y=> z => x+y+z;<\/pre><\/div>\n\n\n\n
Currying and Partial Application<\/strong><\/h3>\n\n\n\n
\/\/original function\nfunction sum(x,y,z){\n return x+y+z;\n}\n\n\/\/currying\nconst currySum = x => y=> z => x+y+z;\n\n\/\/partially applied function\nconst partialApply = sum.bind(null,2,3);\n\n\/\/usage\nconst result = partialApply(4);\nconsole.log(result);<\/pre><\/div>\n\n\n\n9<\/code><\/pre>\n\n\n\nBenefits of Currying<\/strong><\/h3>\n\n\n\n
Common Mistakes<\/strong><\/h3>\n\n\n\n
\n
Conclusion<\/strong><\/h2>\n\n\n\n