在前端开发中，有时需要使用eval函数来动态执行代码。但是，由于eval的执行环境会影响到全局作用域，会带来一些潜在的安全隐患。因此，出现了一些用于修补这一缺陷的 npm 包，例如 ember-cli-global-eval-patch。
什么是 ember-cli-global-eval-patch？
ember-cli-global-eval-patch 是一个 npm 包，它为浏览器中使用的 eval 函数提供了一种方式，可以通过使用 with 语句在局部作用域中执行动态代码，这样可以避免全局作用域被污染的问题。这个 npm 包是专门为 Ember.js 开发的，但也可以在其他前端应用中使用。
安装 ember-cli-global-eval-patch
使用 npm 安装 ember-cli-global-eval-patch：
--- ------- ---------------------------
然后，将其引入到你的 JavaScript 代码中：
------ --------------- ---- ------------------------------
使用 ember-cli-global-eval-patch
使用 ember-cli-global-eval-patch，你需要将动态代码放在一个独立的 JavaScript 文件中，然后通过 AJAX 加载该文件，并将其作为字符串传递给 patchGlobalEval 方法：
------ --------------- ---- ------------------------------ ------------------------------------ -------------- -- ---------------- ---------- -- -----------------------
这里的 fetch 方法是用于发送 AJAX 请求的，你也可以使用其他方法来实现。这里我们将 response 对象转换为一个字符串，然后将字符串作为参数传递给 patchGlobalEval。
示例：使用 ember-cli-global-eval-patch 动态加载 HTML
以下示例演示了如何使用 ember-cli-global-eval-patch 在前端动态加载 HTML。首先，我们在 HTML 文件中创建一个空的 div 元素：
--------- -----
------
------
----- ----------------
-------------- ---- ----- -----------------------------------
-------
------
---- ------------------------
------- ----------------------
-------
-------然后，在 JavaScript 文件中，使用 fetch 方法加载一个 HTML 文件，将其作为字符串传递给 patchGlobalEval，并将结果插入到 div 元素中：
------ --------------- ---- ------------------------------
--------------------------------------
-------------- -- ----------------
---------------- -- -
-----------------
----- --------- - ----------------------------------------
------------------- - ------------------------------
---
---这里，我们使用了 ES6 模板字符串来构建动态代码。我们创建了一个 div 元素，使用 JSON 序列化将 HTML 字符串插入到了该元素中。
结论
ember-cli-global-eval-patch 是一种在浏览器中使用 eval 函数时避免全局作用域被污染的方法。在某些特定的情况下，如果你需要使用 eval 函数，这种方法可能很有用。
当然，这并不意味着你应该在你的项目中频繁使用 eval 函数。尽量减少使用 eval 函数，有助于提高代码的安全性和可维护性。
参考文献
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/6005707881e8991b448e7e71