在上一节内容中，我们探讨了 Hook 的基类是如何实现的，这个基类中包含了一些公共方法，还有需要子类覆盖的 compile 方法，在整个 hook 管理的过程中，compile 是最重要和最复杂的内容。在本节内容中，我们将探讨 tapable Hook 中的工厂类 HookCodeFactory 的原理，了解 compile 函数的生成原理。

目录

• 目录
• 生成函数
• HookCodeFactory

生成函数

从 HookCodeFactory 名称来看，这是一个生成函数的 “代码工厂”。但从生成函数而言，一般有如下两种方式：

• 使用 eval 执行函数代码字串。
• 使用 new Function() 生成函数。 new Function() 可以接 n 个参数，最后一个参数作为函数体。

区别：

	作用域	访问变量	案例
eval	局部作用域	局部变量（window.eval () 或者 global.eval () 除外）	参考 import-html-entry 原理 一文中 evalCode 的代码
new Function	全局作用域	全局变量	参考 Vue 中生产渲染函数的代码（_h 函数）

参考：

• eval 与 new Function 的区别 - SegmentFault 思否 (opens new window)
• javascript - Are eval() and new Function() the same thing? - Stack Overflow (opens new window)

HookCodeFactory