函数式编程范式在很多框架和库里中使用十分广泛，目前React已经全面拥抱函数式组件，源码中处处体现了函数式编程的思想。Vue3里所有的响应式API都是函数式编程，可以用reactive、watch、computed来组合出各种各样的可复用的逻辑。包括使用很广泛的lodash工具库就是一个典型的函数式编程库，此外包括Redux，Koa，Express里面也有很多是函数式编程。所以学习了解函数式编程范式是很有必要的。

# Template的编译过程

我们都知道，在写vue描述dom结构的时候，可以写template，也可以写render函数，而template也最终会被编译成render函数用于渲染页面。template编译时会分为3个阶段：解析(parsing)、转换(transform)、生成(generate)，如下图所示，在parse阶段，vue-compiler模板转换为AST，在transform阶段，对代码进行各种转换和标记，在generator阶段，再用new Function和with的组合，将AST转换成最终render函数。

如下图所示:

_{-- 图片源自网络，侵删}

# 组件的本质

当我们使用 Vue 或 React 时，往往会将页面拆分为各种组件，通过拼装组件来形成页面和应用，就像搭积木一样。

那么，大家有没有思考过："组件的产出是什么？"