写给前端工程师看的函数式编程对话 - 5

752 阅读5分钟

前篇:juejin.cn/post/694128…

第五天:我,穷人,打钱!

学生:早,我们的第一步是不是复习上节课的内容哇

方:嗯对

学生:上节课讲了可以用函数来表示二元组,可以用二元组来表示数组(list/array)

方:看来你有记笔记,今天居然没忘

学生:今天要学习更复杂的数据结构吗?

方:嗯,讲一讲「对象」吧。我们常说的对象,其实是「哈希表」,大概长这样:

const me = {
  name: '方应杭',
  age: 18,
  title: '前端工程师'
}

me.age // 18
me['age'] // 18

学生:嗯

方:我说 me 可以用函数表示,你应该不反对吧?

学生:能给代码我看看吗

方:来了:

createPerson = (name, age, title) => key =>
  key === 'name'  ? name :
  key === 'age'   ? age :
  key === 'title' ? title :
                    null
me = createPerson('方应杭', 18, '前端工程师')
me('age') // 18

学生:好吧,me 确实可以用函数表示……但是用对象来表示 me,会让 me.age 查找起来更快,你的代码会将 key 与不同字符串进行逐个对比,字符串越多,查找越慢

方:没错,但是这很好优化,可以通过提供内置的对象构造器来优化,也可以通过编译器优化,这些优化都不是我们需要讨论的内容。

学生:了解。

方:目前我们是在复习上节课的内容, 好让你相信,不管多么复杂的数据结构,都是可以用函数表示的:真实的数据被存在该函数内部,该函数会再暴露出了一个函数用来访问真实的数据。这句话你听着有没有觉得耳熟?

学生:有!JS 的闭包就是这样的。

方:没错,这就是闭包(Closure)。createPersion() 返回的函数(记为 temp),再加上这个函数能访问到的自由变量(name、age、title),组合起来就叫做闭包。

学生:那闭包有什么用?

方:闭包一方面存储 name、age 和 title,一方面让 temp 函数去操作这些变量,这就是闭包的全部作用。

学生:这有什么用?

方:这作用还不够大嘛?

学生:这作用算什么大?我用对象轻松就能达成这些功能啊:

const obj = {
  name: '方应杭', age: 18, title: '前端工程师', 
  get(key){ if(key)...return... }
}

对不对?

方:你说到点子上了,闭包和对象是可以相互代替的:你即可以用对象来容纳数据,然后暴露接口来操作数据;也可以用闭包来容纳数据,然后暴露接口来操作数据。

学生:原来是这样

方:由于 JS 程序员更喜欢对象,所以对闭包总是本能地拒绝。实际上网上流传过这么一句话:「闭包是穷人的对象,对象是穷人的闭包」Closures are poor man's objects. Objects are poor man's closures.

学生:这话怎么理解

方:有些语言,比如 Java 的前几个版本,函数不能访问自由变量,也就不可能组成闭包了,那么你要「容纳数据,然后暴露接口来操作数据」只能使用类和对象了,所以说「对象是穷人的闭包」,意思是想用闭包的 Java 程序员是穷人(很窘迫),不得不选择对象作为代替品。

学生:原来如此

方:另一方面,有些语言,并没有提供真正的对象,只能使用闭包来「容纳数据,然后暴露接口来操作数据」,所以说「闭包是穷人的对象」。

学生:那 JS 呢?

方:JS 两个都支持,但两个都支持地一般般。你说 JS 支持面向对象吧,它的 class 又残缺不全;你说 JS 支持函数式吧,它的尾递归优化又迟迟不能落地。就挺尴尬的,这导致 JS 程序员学面向对象学得不够好,学函数式也学得不够好……

学生:那我怎么办?

方:多学点编程语言就行了。

学生:哦……对了,网上还说闭包会造成内存泄露,是真的吗?

方:别理这种说法,说这话的人既没有理解闭包,也没有理解内存泄露。

学生:哦好。那你刚刚说的自由变量又是什么呢?

方:还是得用代码举例:

const v1 = '全局变量'
const f1 = (p1, p2)=>{
  // p1 和 p2 是 f1 的参数 
  const v2 = 'f1 的本地变量' 

  const f2 = (r1, r2) => {
     // r1、r2 是 f2 的参数
     const v3 = 'f2 的本地变量'
     console.log(p1, p2, v2) 
     // p1、p2、v2 不是 f2 的本地变量,也不是全局变量,
     // 那么我们认为它们是 f2 的自由变量
  }
  f2()
}
f1()

你可以认为,对于一个函数来说,

  1. 定义在顶级作用域的是全局变量
  2. 定义在该函数的 参数列表 里的变量,是这个函数的参数变量
  3. 定义在该函数的 函数体 里的变量,是这个函数的本地变量
  4. 除了上面三种之外的变量,就是这个函数的自由变量
  5. 有的地方认为参数变量也属于本地变量

但这个概念其实没有明确地定义,你大概理解就行了。

学生:我可不可以理解为当前函数词法作用域外部的局部变量,就是自由变量。

方:对。哟,你还知道词法作用域呢

学生:(笑)从书上学的

方:尽量不要去用自己没有完全理解的概念,用直白的语言描述就行了。

学生:好的,以后我尽量不说还没学的术语。

方:另外,要记住函数其实也是变量,所以 f1 也是 f2 的自由变量。以后我不专门说你也要知道。

学生:那是当然,这我还是知道的。

方:那么我们今天的内容就讲完了:闭包是穷人的对象,对象是穷人的闭包。

学生:感觉没听过瘾啊

方:下次,下次吧

学生:好吧

后续:掘金 (juejin.cn)