Javascript中的错误

错误是不可避免的。他们发生了。在本文中，我们将使用try和catch探索JavaScript中的基本错误处理。

打开您的开发人员工具控制台和代码：

• Chrome: Ctrl + Shift + J or Cmd + Opt + J (Mac).
• Firefox: Ctrl + Shift + K or Cmd + Opt + K on (Mac).

Try & Catch语法

我们首先来看一下try和catch语法。基本上我们创建了两个代码块。第一个包含我们将尝试的代码。第二个块用于捕获和处理任何潜在的错误：

try {
 // 正常处理
}
catch(error) {
 // 处理任何潜在错误的代码
}

第一个错误

错误可能由于许多原因而发生。为了看看它是什么样的，我们将用拼写错误创建自己的东西。

为了说明这个错误，我们将使用alert()方法。 alert()方法使用指定的方法在浏览器中创建弹出窗口。

首先，让我们创建一个成功的警报。在控制台中键入以下内容：

alert("It is a lovely day");

我们将“意外地”命名我们的方法警报。复制以下代码，看看会发生什么：

alerting("It is a lovely day");

我们得到此错误的原因是因为alerting()方法不存在。通过“意外地”给它错误的名称，我们试图引用一个未定义的函数 - 因此，错误就此诞生了。

好的，但真正发生了什么？

当JavaScript中发生运行时错误时，将创建并抛出一个新的Error对象。此错误对象最多可以包含三个属性：错误，发生错误的文件名以及包含错误的行号。

捕获我们的语法错误

考虑到所有这些，我们可以使用try和catch块来捕获上面的引用错误。我们将使用上面相同的拼写错误代码，这次将它放在try块中。我们将在catch块中调用我们返回的Error对象。这是代码的样子:

try {
 alerting("It is a lovely day");
}
catch(error) {
 console.log(error);
}

当我们在浏览器中运行时，我们得到：

虽然结果看起来很相似，但根本不是。我们所做的是控制我们的错误。我们不是让浏览器处理我们的错误，而是自己处理它。我们甚至可以根据错误生成自定义操作。例如，我们可以提醒自定义文本，而不是记录错误：

try {
 alerting("It is a lovely day");
}
catch(error) {
 alert("Uh, Oh, Error");
}

结果是：

现在，对于调试或开发人员来说，这并没有那么有用。但在我看来，当涉及到用户的自定义错误消息时，try和catch真的很闪耀。

是时候Throw

Throw允许我们抛出自己的错误并指定错误的名称和消息。这是一个例子：

throw new Error('Yeah... Sorry');

我们可以在try catch块中使用throw，看看会发生什么。请注意，我已将catch中的参数名称更改为e。这个参数可以命名我们想要的任何东西，我刚刚选择了e，因为它是错误的简称：

try {
 throw new Error('Yeah... Sorry');
}
catch(e) {
 console.log(e);
}

这是我们得到的：

我们现在用throw创建了自己的错误，并使用catch自己处理它。

Finally… Finally

Finally！我们终于可以探索了。

Finally代表一个代码块，我们可以在try和catch结束后用来执行代码。最终将运行是否抛出错误。 这是完整语法的样子：

try {
 // Code that we will 'try'
}
catch(error) {
 // Code that handles any potential errors
}
finally {
 // Code that will run at the end
}

为了说明最终代码无论如何都运行，我们可以尝试运行两个不同的代码示例。在第一个，我们将抛出一个错误。在第二个中，不会抛出任何错误：

错误:

try {
 throw new Error('Yeah... Sorry');
}
catch(e) {
}
finally {
 console.log('finally running');
}
// finally running

现在没有错误：

try {
}
catch(e) {
}
finally {
 console.log('finally running');
}
// finally running

如您所见，这两个代码都导致我们的finally块运行，并且最终运行到控制台。

把它们放在一起

这是一个简单的例子，我使用try throw catch，最后在一个代码块中：

在我们的try块中，我们将要求用户在弹出窗口中键入“hello”。如果输入任何其他内容，我们会抛出错误。我们的catch阻止向用户发出此错误警告，最后我们捕获它。这是代码：

try {
 let hello = prompt("Type hello");
 if (hello !== 'hello'){
 throw new Error("Oops, you didn't type hello");
 }
}
catch(e) {
 alert(e.message);
}
finally {
 alert('thanks for playing!');
}

关键要点

• try?—? 尝试的代码可能会产生错误
• catch?—? 将处理任何错误的代码
• throw?—? 您可以用来抛出自己的自定义错误的关键字
• finally?— ?无论结果如何，将在try/catch块之后运行的代码