How to implement function currying and decurrying in Javascript

Function currying (black question mark face)? ? ? Currying (black question mark face)? ? ? This is a perfect Chinese translation. Let’s take a look at what function currying is:

Wikipedia explains: A technique that transforms a function that accepts multiple parameters into a function that accepts a single parameter (the first parameter of the original function) and returns a new function that accepts the remaining parameters and returns the result. It was proposed by mathematician Haskell Brooks Curry and named after curry.

Concepts are often dry and difficult to understand. Let's explain it in human language: if we are not sure how many parameters this function has, we can first pass it a parameter, and then use JS closures (if you don't understand JS closures, please learn closure knowledge points before learning this blog post https://www.cnblogs.com/dengyao-blogs/p/11475575.html) to return a function. The internal function receives the remaining parameters except the first parameter for operation and output. This is the currying of the function;

Here is a small example:

Scenario (requirements):

As we all know, programmers work a lot of overtime every day. If we need to calculate a programmer's daily overtime, our first reaction should be this;

var overtime=0;
function time(x){
    return overtime+=x;
}

time(1); //1
time(2); //3
time(3); //6

There is no problem with the above code, but it is very troublesome to add the time of the day every time it is called, and certain operations must be performed every time the function is called. If the amount of data is huge, there may be a risk of affecting performance. So is there a lazy way to solve the problem? some!

function time(x){
  return function(y){
        return x+y;
    }      
}

var times=time(0);
times(3);

However, there are still problems with the above code. In actual development, our parameters are often uncertain. Although the above code simply implements the basic operation of currying, it cannot handle the situation where the parameters are uncertain; so there are limitations on function parameters; but from the above code, we can basically know what function currying means; that is, when a function is called, only one parameter is allowed to be passed in, and then the inner function is returned through the closure to process and receive the remaining parameters. The returned function remembers the first parameter of time through the closure;

Let's transform the code again:

// First define a variable receiving function var overtime = (function() {
//Define an array to receive parameters var args = [];
//Closure is used here to call an external function to return an internal function return function() {
  //arguments is a built-in object in the browser, specifically used to receive parameters //If the length of the parameter is 0, that is, there is no parameter if (arguments.length === 0) {
    //Define variables for accumulation var time = 0;
    //Loop accumulation, compare i with the length of args for (var i = 0, l = args.length; i < l; i++) {
    //The accumulation operation is equivalent to time=time+args[i]
        time += args[i];
      }
    // Return the accumulated result return time;
    //If the length of the arguments object parameter is not zero, that is, when there are parameters}else {
    //Add arguments to the defined empty array as an array item. The first parameter args is used to change the this pointer. The second parameter arguments adds the remaining parameters as an array to the empty array [].push.apply(args, arguments);
    }
  }
})();

overtime(3.5); // Day 1 overtime(4.5); // Day 2 overtime(2.1); // Day 3//...

console.log( overtime() ); // 10.1

The code has been modified to achieve the function, but this is not a complete implementation of function currying. So how can we achieve it completely? Here we introduce a general implementation method:

//Define the currying method, first pass in a parameter var currying = function (fn) {
  //Define an empty array to assemble the remaining parameters of the arguments object var args=[];
  //Use closure to return a function to handle the remaining parameters return function () {
    //If the length of arguments is 0, there are no remaining parameters if(arguments.length===0){
    //Execute the above method //Here this points to s below, similar to s(), which means that when the parameter length is 0, the function is called directly return fn.apply(this,args)
    }
    console.log(arguments)
  //If the length of arguments is not 0, there are remaining parameters //Add an array to the prototype object of the array, and use apply to change the pointer of this to args
  //Add the array of [].slice.call(arguments) to the prototype array //Here [].slice.call(arguments) === Array.prototype.slice.call(arguments) essentially converts the arguments object into an array with slice functionality Array.prototype.push.apply(args,[].slice.call(arguments))
    //args.push([].slice.call(arguments))
    console.log(args)
  //The arguments.callee returned here is the returned closure function. Callee is a property in the arguments object, which is used to return the function object being executed. return arguments.callee
  }
}
  //Here the currying method is called and the add function is passed in. The result will return the function inside the closure var s = currying(add);
  //Call the function inside the closure. When there are parameters, the parameters will be gradually added to the args array. When there are no parameters passed in, it will be called directly. //The call supports chain operations s(1)(2)(3)();
//You can also pass in multiple parameters s(1,2,3) at one time;
  console.log(s());

Advantages of JS function currying:

• The calculation can be delayed, that is, if the curried function is called with parameters, the parameters will be added to the array for storage and will be called when no parameters are passed in;
• Parameter reuse: When the same function is called multiple times and most of the parameters passed are the same, then the function may be a good candidate for currying.

Everything in the world is relative, there is a cause and an effect, of course, if there is currying, there must be de-currying;

Uncurrying, literally speaking, is the opposite of currying. In fact, the real purpose of uncurrying is to expand the scope of application. That is, when we call a method, we don’t need to consider whether the object itself has this method in the design process. As long as the method is applicable to it, we can use it. (Here is the idea of ​​duck typing in dynamic languages)

Before learning JS anti-currying, let's first learn about the duck typing idea of ​​dynamic languages ​​to help us better understand:

Dynamic language duck typing idea (Wikipedia explanation):

In programming, duck typing is a style of dynamic typing.

In this style, the effective semantics of an object are determined not by inheriting from a specific class or implementing a specific interface, but by the current set of methods and properties.

The name of this concept comes from the duck test proposed by James Whitcomb Riley. The "duck test" can be expressed as follows:

When you see a bird that walks like a duck, swims like a duck, and quacks like a duck, then the bird can be called a duck.

Theoretical explanations are often dry and difficult to understand. To put it in human terms, you are your mother's son/daughter. No matter whether you are excellent or beautiful, as long as you are your mother's biological child, you are your mother's son/daughter. To put it in terms of duck types, as long as you can quack and walk like a duck, as long as you behave like a duck, no matter whether you are a duck or not, you can be called a duck.

There are many duck-type references in Javascript. For example, when we assign a value to a variable, we obviously do not need to consider the type of the variable. This is why Javascript is more flexible, so Javascript is a typical dynamically typed language.

Let's take a look at how duck types are referenced in decurrying:

//Add uncurring method to function prototype object Function.prototype.uncurring = function() {
//Change the pointer of this //Here this points to Array.prototype.push
  var self = this;
    //The closure here is used to return the execution of the inner function return function() {
    //Create a variable, add shift to the prototype object of the array and delete the first parameter //Change the array this to arguments
    var obj = Array.prototype.shift.call(arguments);
    //Finally return to execution and change the method to point to obj, which is arguments
   // and pass arguments as parameters return self.apply(obj, arguments);
  };
};

//Add uncurrying method to array prototype object var push = Array.prototype.push.uncurring();

//Test //Anonymous function self-execution (function() {
    //The push here is a function method //It is equivalent to passing in two parameters, arguments and 4. However, in the above shift method, the first parameter is deleted, and the arguments parameter here is intercepted, so in the end only 4 is actually passed in.
  push(arguments, 4);
  console.log(arguments); //[1, 2, 3, 4]
//Anonymous function calls itself and takes in parameters 1, 2, 3
})(1, 2, 3)

At this point, you can think about it. Arguments is an object that receives parameters, and there is no push method in it. So why can arguments call the push method?

This is because the code var push = Array.prototype.push.uncurring(); adds the uncurring method to the push method of the array prototype object, and then executes the anonymous function method push(arguments, 4);. In fact, it is calling the above method to add the uncurring method to the prototype object of Function and return a closure inner function to execute. During the execution process, the shift method on the Array prototype object will intercept the arguments in push(arguments, 4);. Therefore, the actual method call is push(4), so the final result is [1,2,3,4].

In the book "JavaScript Design Patterns and Development Practices", the case of anti-currying of JS functions is written as follows:

//Define an object var obj = {
    "length":1,
    "0":1
}
//Define the uncurrying method in the Function prototype object
Function.prototype.uncurrying = function() {
    //this points to Array.prototype.push
    var self = this;
    //The closure returns an inner function return function() {
    // This can be broken down into parts // First execute apply return 
    //Function.prototype.call(Array.prototype.push[obj,2])
   //Then Array.prototype.push.call(obj,2)
    //call changes the pointer to obj.push(2)
    //So the final result is {0: 1, 1: 2, length: 2}
        return Function.prototype.call.apply(self, arguments);
}
}

// in var push = Array.prototype.push.uncurrying()

push(obj, 2) 
console.log(obj);
//{0: 1, 1: 2, length: 2}

The above method is hard to understand? It doesn’t matter, let’s make it easier to understand:

Function.prototype.unCurrying = function () {
    var self = this;
    return function () {
    //[].slice.call(arguments,1)===Array.prototype.push.slice.call(arguments,1)===arguments.slice(1)
return self.apply(arguments[0], [].slice.call(arguments, 1));
    };
};



var push = Array.prototype.push.uncurrying()
console.log(push);
push(obj,2) //{0: 1, 1: 2, length: 2}
console.log(obj);

Let’s analyze it:

1. First, add the uncurrying method to the Function prototype object so that all functions can borrow it;

2. Return a closure inner function

3. The result returned by the closure function is the calling method, self points to Array.prototype.push, and the first parameter in the apply method is the change point. The following push(obj,2) is equivalent to changing the point to obj.push(2)

4. The call method of the second parameter in the apply method is changed to point to arguments, and the slice method can be used in arguments, which is equal to arguments.slice(1)

The above is the details of how to implement function currying and de-currying in Javascript. For more information about Javascript function currying and de-currying, please pay attention to other related articles on 123WORDPRESS.COM!