在前端开发中，调试是一个必不可少的环节。随着 JavaScript 语言的发展，语言本身也提供了越来越多的开发工具。本文将介绍如何使用 ES7 中的 Generator 函数生成断点调试栈，以提高调试效率。
什么是 Generator 函数
Generator 函数是 ES6（ES2015）中引入的一种新的函数类型。它可以通过遍历器协议控制函数的执行过程，使得函数的执行可以暂停和恢复。同时，它还可以提供一种生成序列的方法。
Generator 函数的声明方式与普通函数差不多，只是在 function 后面加了一个星号：
function* myGenerator(){
//函数体
}在函数体中，可以使用 yield 表达式控制函数的执行和返回值。
使用 Generator 函数生成断点调试栈
断点调试是一种常用的调试方式。当我们在开发过程中遇到问题时，可以在代码中设置断点，以便检查代码的执行过程。
在 ES7 中，可以使用 Generator 函数生成断点调试栈。这个调试栈可以记录函数执行过程中的函数名、参数和返回值等信息。通过断点调试栈，我们可以更方便地找到代码中的问题。
下面是一个使用 Generator 函数生成断点调试栈的示例代码：
-- -------------------- ---- -------
--------- -------------- ---
----- ------- - ----- ----------- ---
----- ------- - ----- ----------------- ---------
------ --------
-
-------- --------------
----- ------ - ----
----------------
----- ------------ - -----------------------------
----------------
--------------------------------- ------------- ----- --- --- ------- ---------
------ -------
-
----- ------------- - ---
----- --- - -------------- ---
--- ------- - -----
-------------- -- ---------------
------- - ---------------- -- ---------------
-在这个示例中，定义了一个 myGenerator 函数和一个 multiply 函数，并创建了一个空数组 debuggerStack。我们使用 while 循环来遍历 myGenerator 函数中的所有 yield 语句。
在 multiply 函数中，我们使用 arguments.callee.caller.name 来获取当前函数的名字，并将调试信息添加到 debuggerStack 中。
最后，我们可以在浏览器中使用调试器来检查 debuggerStack 中的内容。
总结
通过使用 ES7 中的 Generator 函数生成断点调试栈，我们可以更方便地进行调试，并对代码中的问题进行更深入的挖掘。这种方法适用于任何复杂的函数调用场景，可以帮助我们更快地识别和解决问题。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64eb0ca3f6b2d6eab35b706e