面试官：什么是柯里化？怎样实现柯里化？

前端老道

发布于 2022-12-01 10:01:22

1.5K0

发布于 2022-12-01 10:01:22

文章被收录于专栏：Vue开发社区

一、什么是函数柯里化

柯里化（Currying）是把接受多个参数的函数变换成接受一个单一参数(最初函数的第一个参数)的函数，并且返回接受余下的参数且返回结果的新函数的技术。

说的啥玩意啊？是不是一脸懵逼~

接下来咱们用一个经典的面试题讲解下：实现 add(1)(2)(3) 求和

第一步：接收三个参数

  function add (a, b, c) {
    return a + b + c
  }
  
  // add(1, 2, 3)

第二步：接收两个参数

function add (a, b) {
  return function (c) {
    return a + b + c
  }
}

// add(1,2)(3)

到这是不是有点眉头了？

第三步：每个函数都接收一个参数

function add (a) {
  return function (b) {
    return function (c) {
      return a + b + c
    }
  }
}

// add(a)(b)(c)

es6 更简单

const add1 = (a, b) => a + b
const add2 = a => b => a + b
const add3 = a => b => c => a + b + c

看到这咱们就大致明白前文的解释了，将多个参数函数变为接受一个单一参数的函数。

但是假如面试官让你用一个函数同时支持 add(1,2,3), add(1,2)(3), add(1)(2)(3)怎么办？

先补充个概念，下面要用到 --- 函数的长度是啥？

function test (a) {} 
console.log(test.length) // 1
function test (a, b) {}
console.log(test.length) // 2

由此得知函数的长度就是 形参的个数

思路：

判断当前传入函数的参数个数 (args.length) 是否大于等于原函数所需参数个数 (fn.length) ，如果是，则执行当前函数；如果是小于，则返回一个函数。

const curry = (fn, ...args) => {
  if (args.length >= fn.length) {
      return fn(...args) // 执行当前函数
  } else {
      return (..._args) => { // 返回一个函数
       return curry(fn, ...args, ..._args)
     }
  }
}

三、有什么作用？能干啥

参数复用
提前返回
延迟执行

总结不到位的请多多交流指出~

本文参与腾讯云自媒体同步曝光计划，分享自微信公众号。

原始发表：2022-09-23，如有侵权请联系 cloudcommunity@tencent.com 删除

javascript

本文分享自前端开发社区微信公众号，前往查看

如有侵权，请联系 cloudcommunity@tencent.com 删除。

本文参与腾讯云自媒体同步曝光计划，欢迎热爱写作的你一起参与！

javascript

登录后参与评论

0 条评论

热度