Detailed understanding of Javascript currying in interview questions

This article brings you a detailed understanding of Javascript currying in interview questions. It has certain reference value. Friends in need can refer to it. I hope it will be helpful to you.

Interview question: Implement add(1)(2)(3) //Result = 6, the core of the question is the currying of js

Let’s first talk about what currying is Currying, I have read many articles about currying, but I still can’t figure it out. For example: Currying transforms a function that accepts multiple parameters into one that accepts a single parameter (the first parameter of the original function). function and return a new function that accepts the remaining parameters and returns a result. Most blogs say this, and to be honest I'm confused.
My understanding is that curry is a method of collecting parameters. If enough is collected, the function will be executed.

Let’s list the key points before implementation
1. Collect parameters (just like interview questions that execute multiple parameters multiple times). Yes, use closures
2. Each execution parameter has More or less, for example add(1)(2,3)(4)
3. We need to know when the parameters are enough

        //如题
        //add(1)(2)(3)
        //逻辑应该是这样add(1)执行收集参数1继续执行收集参数2依次类推直到收集完毕。
       function curry(fn) {
            let arg = []; //用于收集参数
            //做一个闭包https://segmentfault.com/a/1190000017824877
            return function() {
                //每执行一次收集一次参数,为什么用concat是因为有时候后是多个参数(2,3)
                arg = arg.concat([...arguments]);
                //直到参数收集完成执行fn
                // 我们需要知道什么时候收集完了，条件就是curry参数fn的参数个数 fn.length
                //如果收集的参数个数大于等于fn的参数个数执行fn,如果没有递归执行
                if (arg.length >= fn.length) {
                    return fn(...arg)
                }
                // 参数没有收集完我们需要继续收集，递归
                return arguments.callee
            }
        }

        // 测试一下
        let testAdd = curry(add1)
        // console.log(testAdd(1)(2)(3))
        // console.log(testAdd(1, 2)(3))
        //console.log(testAdd(1)(2, 3))

Accidentally finished writing!

But I can’t make headlines. I’ll give you a detailed explanation. Next, let’s analyze most of the currying implementation codes on the Internet.

function curry(fn) {
  function _c(restNum, argsList) {
    return restNum === 0 ?
      fn.apply(null, argsList) :
      function(x) {
        return _c(restNum - 1, argsList.concat(x));
      };
  }
  return _c(fn.length, []);
}

It’s okay if you can’t understand it at first glance. Let’s take a look at it more.
Analysis:
1. Curry also receives a parameter (fn). This is inevitable.
2. It returns a function and receives two parameters, fn.length and an empty array. This is a good explanation.
Explanation , as I said in the simplified version I wrote, fn.length is used to determine whether the parameters have been collected enough. Passing an empty array as a parameter is actually an implementation of closure, used to collect parameters.
3. There is a trinocular judgment inside. It looks fancy but not that complicated. If the number of parameters for judging fn is 0, there is no need to collect them and execute fn directly. As for fn.apply(null,argList) I If you say it clearly out loud, can you just apply it and use it everywhere? In my opinion, it is useless. The reason why it is used is because argList is an array, and apply just supports that the second parameter is an array. It mainly looks very awesome.
4. Collect parameters. The number of fn parameters is not zero. Each time the number of fn function parameters is collected, decrease it by one until it equals 0 and execute fn. This is not as versatile as what I wrote. I passed two at once and it died. .

Another example: bind method implementation

Function.prototype.bind = function(context) {
            //返回一个绑定this的函数，我们需要在此保存this
            let self = this
                // 可以支持柯里化传参，保存参数
            let arg = [...arguments].slice(1)
                // 返回一个函数
            return function() {
                //同样因为支持柯里化形式传参我们需要再次获取存储参数
                let newArg = [...arguments]
                console.log(newArg)
                    // 返回函数绑定this，传入两次保存的参数
                    //考虑返回函数有返回值做了return
                return self.apply(context, arg.concat(newArg))
            }
        }

        // 搞定测试
        let fn = Person.say.bind(Person1)
        fn()
        fn(18)

Yes, the bind method uses currying.

The above is the detailed content of Detailed understanding of Javascript currying in interview questions. For more information, please follow other related articles on the PHP Chinese website!