我的 JavaScript 脚本中可能出现哪三种类型的错误?


在本教程中,我们将讨论 JavaScript 代码中可能出现的的三种类型的错误。

错误是阻止程序执行的语句。在程序编译期间,可能会发生三种类型的错误。这些是语法错误、运行时错误和逻辑错误。

语法错误

语法错误是常见的错误。不正确的语法会导致代码解释期间出现解析问题。例如,在对象声明中使用分号而不是冒号。语法错误仅影响相应的代码线程。其余代码按原样工作。

语法错误的根本原因是语法错误。不正确的 JSON 对象解析是在运行时从 ajax 响应中发生的语法错误。

当 JavaScript 引擎无法理解我们的代码时,就会发生语法错误。运行代码之前有三个步骤。

首先,代码标记化通过将代码分解成小的单元来进行。标记化阶段对数字、关键字、文字和运算符进行分类。

下一个阶段是解析。在这里,它生成 AST 或代码结构的抽象表示。

发生语法错误时,代码将不会更改为机器代码。

我们可以快速跟踪语法错误,因为编译器会用行号跟踪错误。

let jsonObj =
{
   name; 'Egan' //semicolon is the syntax error here
}

示例

在这个例子中,我们犯了分号错位错误。我们会在控制台中看到带有行号的错误跟踪。因为我们有 onerror 处理程序,所以我们看到了“未声明函数”的意外错误。此错误是由于语法错误造成的。

<html> <head> <script type = "text/javascript"> window.onerror = function(e) { syntErrOp.innerHTML = e; }; </script> <script type="text/javascript"> function getSyntErr() { var syntErrBtnWrap = document.getElementById("syntErrBtnWrap"); var syntErrOp = document.getElementById("syntErrOp"); let jsonObj = { name; 'Egan' } } </script> </head> <body> <div id="syntErrBtnWrap"> <p>Click the button to see the error</p> <button onclick="getSyntErr()">Click Me</button> </div> <div id="syntErrOp"></div> </body> </html>

运行时错误

运行时错误发生在编译器解释之后。运行时错误的另一个名称是异常。例如,调用未声明的函数。运行时错误会阻止程序执行。我们可以使用 try-catch 块来处理这些异常。类型错误和范围错误属于运行时错误。

零除和访问不可用内存是运行时错误的示例

callUndefined();
//no function declaration

示例

在这个例子中,我们犯了“未声明函数”的错误。我们会在控制台中看到带有行号的错误跟踪。因为我们有 onerror 处理程序,所以我们看到了相同的“未声明函数”错误。

<html> <head> <script type = "text/javascript"> window.onerror = function(e) { runTimeErrOp.innerHTML = e; }; </script> <script type = "text/javascript"> function getRunTimeErr() { var runTimeErrBtnWrap = document.getElementById("runTimeErrBtnWrap"); var runTimeErrOp = document.getElementById("runTimeErrOp"); callUndeclare(); } </script> </head> <body> <h2>Runtime error in JavaScript</i></h2> <div id="runTimeErrBtnWrap"> <p>Click the button to see the error</p> <button onclick="getRunTimeErr()">Click Me</button> </div> <div id = "runTimeErrOp"> </div> </body> </html>

逻辑错误

开发人员需要使用智能和推理技能来追踪逻辑错误。这些错误发生在代码流中。例如,假设 x 大于 y。但是我们得到的输出是 y 大于 x。所以这是代码逻辑中的一个错误。

使用无限循环是逻辑错误的一个例子。当开发人员对变量的使用感到困惑时,就会出现逻辑错误。开发人员必须小心程序的算法,以避免逻辑错误。

示例

在这个例子中,我们减去两个数字而不是将它们相加,并将减法结果显示为两个数字的和。减法而不是两个数字的加法绝对是开发人员的逻辑错误。

<html> <head> <script type = "text/javascript"> function getlogicErr() { var logicErrBtnWrap = document.getElementById("logicErrBtnWrap"); var logicErrOp = document.getElementById("logicErrOp"); var num1 = 10, num2 = 5, sum; sum = num1 - num2; logicErrOp.innerHTML = num1 + " + " + num2 + " = " + sum; } </script> </head> <body> <h2>Logical error in JavaScript</i></h2> <div id = "logicErrBtnWrap"> <p>Click the button to see the error</p> <button onclick = "getlogicErr()">Click Me</button> </div> <div id = "logicErrOp"> </div> </body> </html>

在本教程中,我们发现了 JavaScript 中的三种错误类型。简而言之,我们可以通过遵循良好的编码实践来防止各种错误。当然,也有一些例外情况。在这里,我们无法避免出现错误。在这种情况下,我们可以假设错误的可能性并使用错误处理程序来跟踪它们。

更新于:2022年10月31日

浏览量:379

启动您的 职业生涯

完成课程获得认证

开始学习
广告
© . All rights reserved.