“这里是云端源想IT，帮你轻松学IT”

嗨~ 今天的你过得还好吗？

生活的麻烦是无穷无尽的

快乐之所以短暂是因为

它本就藏在解决这些麻烦的间隙里

你要学会像及时下班一样及时快乐

- 2023.05.10 -

错误是编程过程的一部分。无论是新手还是有十分有经验的程序员，编写程序的过程难免会出现一些错误，作为新手我们应该站在巨人的肩膀上，学会如何避免遇到这样的情况，以及如何在自己的项目中做的更好。

在 JavaScript 中，当代码语句紧密耦合并产生错误时，继续使用剩余的代码语句是没有意义的。相反，我们应该尽可能优雅地从错误中恢复过来。

JavaScript 解释器在出现此类错误时检查异常处理代码，如果没有异常处理程序，程序将返回导致错误的任何函数。对调用堆栈上的每个函数重复此操作，直到找到异常处理程序或到达顶层函数，从而导致程序以错误终止，导致程序的崩溃。

一般来说，有两种处理方式：

1.抛出异常 ：如果在运行时发生的问题无法得到有意义的处理，最好抛出它

function openFile(fileName) {

if (!exists(fileName)) {

throw new Error('找不到文件 ' + fileName)

}

// ...

}

2.捕获异常： 抛出的异常在运行时更有意义的地方被捕获和处理

try {

openFile('../test.js')

} catch(e) {

// 优雅地处理抛出的期望

}

接下来，我们更详细地说说这两种异常处理方式的具体操作。

一、抛出异常

你可能会看到类似 ReferenceError: specs is not defined 这样的情况。这表示通过 throw 语句引发的异常。

语法

throw ?value?

// 不要这样做

if (somethingBadHappened) {

throw 'Something bad happened'

}

对可以作为异常抛出的数据类型没有限制，但 JavaScript 具有特殊的内置异常类型。其中之一是 Error，正如您在前面的示例中所看到的。这些内置的异常类型为我们提供了比异常消息更多的细节。

Error

Error 类型用于表示一般异常。这种类型的异常最常用于实现用户定义的异常。它有两个内置属性可供使用。

• message：作为参数传递给 Error 构造函数的内容。例如，new Error('This is an error message')。您可以通过 message 属性访问消息。

const myError = new Error('Error!!!')

console.log(myError.message) // Error!!!

• stack ： 该属性返回导致错误的文件的历史记录(调用堆栈)。堆栈顶部还包括 message，后面是实际堆栈，从最新/隔离的错误点开始，到最外部负责的文件。

Error: Error!!!

at <anonymous>:1:1

注意：new Error('...') 在抛出之前不会执行任何操作，即 throw new Error('error msg') ?将在 JavaScript 中创建一个 Error 实例，并停止脚本的执行，除非你对 Error 错误执行某些操作，例如捕获它。

二、捕捉异常

现在我们知道了什么是异常以及如何抛出它们，让我们讨论一下如何通过捕获它们来阻止它们破坏我们的程序。

try-catch-finally 是处理异常的最简单方法。

try {

// 要运行的代码

} catch (e) {

// 发生异常时要运行的代码

}

[ // 可选

finally {

// 无论发生异常都始终执行的代码

}

]

在 try 子句中，我们添加了可能产生异常的代码。如果发生异常，则执行 catch 子句。

有时，无论代码是否产生异常，都需要执行代码，这时我们可以使用可选块 finally。即使 try 或 catch 子句执行 return 语句，finally 块也将执行。例如，以下函数返回 'Execute finally'，因为 finally 子句是最后执行的内容。

function foo() {

try {

return true

} finally {

console.log('Execute finally')

}

}

我们在无法事先检查代码正确性的地方使用 try-catch。

const user = '{"name": "D.O", "age": 18}'

try {

// 代码运行

JSON.parse(params)

// 在出现错误的情况下，其余的代码将永远无法运行

console.log(params)

} catch (err) {

// 在异常情况下运行的代码

console.log(err.message) // params is not defined

}

如上所示，在执行代码之前，不可能检查 JSON.parse 以获得 stringify 对象或字符串。

注意：你可以捕获程序产生的异常和运行时异常，但无法捕获 JavaScript 语法错误。

try-catch-finally 只能捕获同步错误。如果我们尝试将其用于异步代码，那么在异步代码完成其执行之前，try-catch-finally 可能已经执行了。那么我们如何处理异步代码块中的异常呢？下面给大家介绍三种方法：

三、如何处理异步代码块中的异常

回调函数

使用回调函数(不推荐)，我们通常会收到两个如下所示的参数：

async function(code, (err, result) => {

if (err) return console.error(err)

console.log(result)

})

我们可以看到有两个参数：err 和 result。如果有错误，err 参数将等于该错误，我们可以抛出该错误来进行异常处理。

在 if (err) 块中返回某些内容或将其他指令包装在 else 块中都很重要。否则，您可能会遇到另一个错误。例如，当您尝试访问 result.data 时，result 可能未定义。

Promises

使用 promises 的 then 或者 catch，我们可以通过将错误处理程序传递给 then 方法或使用 catch 子句来处理错误。

promise.then(onFulfilled, onRejected)

也可以使用 .catch(onRejected) 而不是 .then(null, onRejected) 添加错误处理程序，其工作方式相同。

让我们看一个 .catch 拒绝 Promise 的例子。

Promise.resolve('1')

.then(res => {

console.log(res) // 1

throw new Error('go wrong') // 抛出异常

})

.then(res => {

console.log(res) // 不会被执行

})

.catch(err => {

console.error(err) // 捕获并处理异常 ——> Error: go wrong

})

使用 async/await 和 try-catch

使用 async/await 和 try-catch-finally，处理异常是轻而易举的事。

async function func() {

try {

await nonExistentFunction()

} catch (err) {

console.error(err) // ReferenceError: nonExistentFunction is not defined

}

}

现在我们已经很好地理解了如何在同步和异步代码块中执行异常处理，最后，再来看看未捕获的异常又该如何去处理呢？

四、如何处理未捕获的异常

也是要分在浏览器中和在 Node.js 中两种情况的，可以根据实际情况来处理这些异常。

在浏览器中

我们可以使用 window.onerror() 方法来处理未捕获的异常。每当运行时发生错误时，该方法会在 window 对象上触发 error 事件。

onerror() 的另一个实用做法是：当站点中的图片或视频等数据加载出错时，可以用该方法触发某些操作。例如，提供一张加载出错时的图片，或显示一条消息。

<img src="logo.png" onerror="alert('Error loading picture.')" />

在 Node.js 中

EventEmitter 模块派生的 process 对象可以订阅事件 uncaughtException。

process.on('uncaughtException', () => {})`

我们可以传递一个回调来处理异常。如果我们尝试捕获这个未捕获的异常，进程将不会终止，因此我们必须手动完成。

uncaughtException 仅适用于同步代码。对于异步代码，还有另一个称为 unhandledRejection 的事件。

process.on('unhandledRejection', () => {})

决不要尝试为基本 Error 类型实现 “捕获所有” 处理程序。这将混淆所发生的一切，并损害代码的可维护性和可扩展性。

五、关键要点

• throw 语句用于生成用户定义的异常。在运行时，当 throw 遇到语句时，当前函数的执行将停止，控制权将传递给 catch 调用堆栈中的第一个子句。如果没有 catch 子句，程序将终止。
• JavaScript 有一些内置的异常类型，最值得注意的是 Error，它返回 Error 中的两个重要属性：stack 和 message。
• try 子句将包含可能产生异常的代码，catch 子句会在发生异常时执行。
• 对于异步代码，最好使用 async/await 配合 try-catch 语句。
• 可以捕获未处理的异常，这可以防止应用程序崩溃。

在实际JavaScript项目开发过程中当我们遇到异常代码不要觉得麻烦，异常处理可以帮助您提高代码的可维护性、可扩展性和可读性。

今天的分享就到这里了，记得点赞和收藏！

我们下期再见！

END

文案编辑|云端学长

文案配图|云端学长

内容由：云端源想分享