JavaScript catch块中丢失backtrace

在本文中，我们将看到 “JavaScript在catch块中丢失了backtrace”的问题。backtrace意味着因为过去的事件而丢失了某些东西。

JavaScript通过维护一个堆栈来跟踪被调用但尚未返回的函数。JavaScript引入了 try-catch块，以便在JS代码出现错误时，应用程序不崩溃，尽管使用了catch块来解决错误，catch块的参数就是该错误。

语法：

try {
    // Do something
}
catch (err) {
    // Do something
}

让我们通过一个详细的示例来理解问题陈述。

示例1： 考虑下面的代码中，总共有3个函数：gfgMain()，gfg1()和gfgAPI()。

HTML

<!DOCTYPE html>
<html lang="en">
 
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content=
        "width=device-width, initial-scale=1.0">
    <title>Geeks for Geeks resolving errors.</title>
</head>
 
<body>
    <h1 style="color: green;"> 
        GeeksforGeeks 
    </h1>
     
    <h3>Losing backtrace</h3>
 
    <script>
        function API_Call(arg) {
            throw new Error(
                'this GeeksforGeeks API returns an error')
        }
 
        function ErrorDetector() {
            try {
                API_Call()
            }
            catch (err) {
                console.log(
                    'ErrorDetector() function enters '
                    + 'in the catch block, as API_Call()'
                    + ' returns an Error')
            }
        }
 
        function Main() {
            try {
                ErrorDetector()
                return 'ErrorDetector() returned successfully'
            }
            catch (err) {
                console.log('ErrorDetector() gives an error', err)
                return 'ErrorDetector() does not returned successfully'
            }
        }
 
        Main();
    </script>
</body>
 
</html>

输出：

JavaScript catch块中丢失backtrace

解释： 在上面的示例中，使用了三个函数：

Main()： Main()函数包含一个try-catch块。在try块内，Main()函数调用ErrorDetector()函数。如果ErrorDetector()函数抛出错误，则会执行catch块。

ErrorDetector()： ErrorDetector()函数也包含一个try-catch块。在try块内，ErrorDetector()函数调用API_Call()函数。如果API_Call()函数抛出错误，则会执行catch块。

API_Call()： API_Call()函数返回一个错误，消息为“这个GeeksforGeeks API返回一个错误”。

现在，对代码进行模拟运行，首先调用 Main() 函数，然后在try块中调用 ErrorDetector() 函数。接着， ErrorDetector() 函数运行 API_Call() 函数，该函数抛出一个错误。由于遇到错误，将执行 ErrorDetector() 的catch块，并在控制台打印一条语句。

通常情况下，由于 API_Call() 函数产生了错误，所以 ErrorDetector() 也应该产生错误，因此 Main() 也应该产生错误。但是，这里的情况并非如此，Main()函数却按预期成功返回。

解决方案： 你可以观察到的问题是， Main() 应该返回一个错误，但却成功返回了。这是一个非常危险的问题，可能导致 隐藏内部错误 ，从而丢失 backtrace 信息，在catch块中。这是因为在 ErrorDetector() 的catch块中执行了，却没有抛出任何错误，这导致了对Main()函数的误导。

为了解决这个错误，只需在 ErrorDetector() 函数的catch块中 抛出一个错误 即可。

示例2： 考虑与上述相同的示例，只需在 ErrorDetector() 函数的catch块中添加 “throw err” 。现在，Main()函数将抛出一个错误，并执行catch块。

HTML

<!DOCTYPE html>
<html lang="en">
 
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content=
        "width=device-width, initial-scale=1.0">
    <title>Geeks for Geeks resolving errors.</title>
</head>
 
<body>
    <h1 style="color: green;"> 
        GeeksforGeeks 
    </h1>
     
    <h3>Losing backtrace</h3>
     
    <script>
        function API_Call(arg) {
            throw new Error(
                'this GeeksforGeeks API returns an error')
        }
 
        function ErrorDetector() {
            try {
                API_Call()
            }
            catch (err) {
                console.log(
                    'ErrorDetector() function enters in the '
                    + 'catch block, as API_Call() returns an Error')
                throw err
            }
        }
 
        function Main() {
            try {
                ErrorDetector()
                return 'ErrorDetector() returned successfully'
            }
            catch (err) {
                console.log('ErrorDetector() gives an error', err)
                return 'ErrorDetector() does not returned successfully'
            }
        }
 
        Main();
    </script>
</body>
 
</html>

输出：

JavaScript catch块中丢失backtrace