数据结构
网络
关系数据库管理系统
操作系统
Java
MS Excel
iOS
HTML
CSS
Android
Python
C 编程
C++
C#
MongoDB
MySQL
Javascript
PHP
物理学
化学
生物学
数学
英语
经济学
心理学
社会学
时尚研究
法律研究如何在我抛出异常时获取 JavaScript 堆栈跟踪？
本教程将教会我们如何在抛出异常时获取 JavaScript 堆栈跟踪。通常，开发人员使用堆栈跟踪来识别程序代码执行期间的错误。但是，我们使用堆栈跟踪来调试程序。
使用堆栈跟踪，我们可以了解程序中任何类型的异常，例如构造函数错误、命名错误等，并可以对其进行更正。
在我们开始使用堆栈跟踪分析错误之前，我们应该了解堆栈跟踪是如何工作的。
调用堆栈跟踪是如何工作的？
堆栈是主要的数据结构，遵循 LIFO（后进先出）属性。当我们在机器上执行任何程序时，操作系统会在堆栈或堆中为程序分配一些动态内存。在大多数情况下，它以堆栈格式分配，因为它易于管理。
例如，我们有两个名为 child() 和 parent() 的函数，如下所示。
function child() {
// code for child function
}
Function parent() {
child();
// code for parent function.
}
parent();在上面的代码片段中，当我们开始执行程序时，它会获得操作系统分配的堆栈跟踪，并且 parent() 函数进入堆栈跟踪。之后，将从父函数调用 child() 函数。因此，它进入堆栈的顶部。
当程序执行完成时，child() 函数将首先从堆栈中删除，然后是 parent() 函数。
现在，用户可以考虑这样的场景：我们不知道哪个函数抛出了错误。他们可以在任何函数中打印堆栈跟踪，了解错误并解决它。
以下是 JavaScript 程序中打印堆栈跟踪的不同方法。
- 使用 Error 对象属性
- 使用 console.trace() 方法
使用 Error 对象属性
在这种方法中，我们将创建一个新的 错误对象进行演示，并从函数返回错误堆栈。错误堆栈还会根据流程打印程序的整个 堆栈跟踪，其中包含从程序开始到最近执行的所有函数调用。
语法
用户可以按照以下语法获取错误堆栈跟踪。
function() {
// execution code for the function
var error = new Error();
return error.stack;
}在语法中，我们使用 error 类的构造函数（即 new Error()）创建了错误。
示例 1
以下示例演示了当我们从任何函数抛出错误时如何打印堆栈跟踪。
<!DOCTYPE html>
<html>
<body>
<h2>The stack trace when we throw an exception.</h2>
<p id="resultDiv"> </p>
<script type="text/javascript">
// this function contains error
// it prints stack trace for all function from parent to getStrackTrace
function getStackTrace() {
var error = new Error();
let resultDiv = document.getElementById("resultDiv");
resultDiv.innerHTML = error.stack;
}
function child() {
getStackTrace();
}
function parent() {
child();
}
// call the parent function
parent();
</script>
</body>
</html>在上面的输出中，用户可以看到它显示了从父函数到抛出错误的 getStackTrace() 函数的整个堆栈跟踪。此外，它还逐行显示每个堆栈元素，这有助于程序员定位错误并找到更好的解决方案。
使用 console.trace() 方法
在这种方法中，我们将使用 console.trace() 方法。这是一种非常直接的方法，可以打印程序到当前行执行的堆栈跟踪。开发人员可以在函数或程序中调用该方法，它会打印堆栈跟踪，用户可以调试整个代码。
语法
用户可以按照以下语法使用 console.trace() 方法。
function() {
// function body
// console.trace();
}示例 2
以下示例演示了如何使用 console.trace() 方法打印堆栈跟踪。它在控制台中打印输出。
<!DOCTYPE html>
<html>
<body>
<h2>The stack trace when we throw an exception. </h2>
<p> Clicking "Trace" button calls startExecution function,
which calls middleOfExecution and printStackTrace, printStackTrace fucntion calls console.trace(),
which displays the trace in the console.</p>
<p>Remember to open the console before you click "Trace".</p>
<button onclick="startExecution()">Trace</button>
<script type="text/javascript">
function printStackTrace(string) {
// create new error and logging it by console.
// var error = new Error();
console.trace(string);
return 10 * 20;
}
function middleOfExecution() {
console.log(10 * 20);
return 10 * 20;
}
// call the printStackTrace function inside this.
function startExecution() {
middleOfExecution();
let string = "tutorialsPoint";
printStackTrace(string);
console.log(string);
}
</script>
</body>
</html>在上面的输出中，用户可以看到 console.trace() 方法如何清晰地打印程序执行的堆栈跟踪。
结论
我们已经看到了两种在抛出错误时获取堆栈跟踪的方法。用户可以根据自己的理解使用任何一种。通常，在使用终端或后端时使用第二种方法。用户可以使用第一种方法将堆栈跟踪记录到浏览器中。
3K+ 次查看
