ES10 新特性解析：try-catch 块可选绑定-JavaScript中文网-JavaScript教程资源分享门户

在ES10中，新特性之一是try-catch块的可选绑定。这个特性能够让你在catch块中获取到错误对象，并且可以直接将错误信息绑定到一个变量中。

为什么需要try-catch块可选绑定?

在JavaScript中，try-catch块提供了一种处理错误的方法。我们可以使用它来捕获发生在try块中的错误，并在catch块中进行处理。然而，在ES6之前，我们只能访问错误对象的名称，而无法像其他语言一样访问错误对象本身。

这是一个问题，特别是在处理异步API中的错误时。在promise中，错误信息通常以对象形式返回。我们希望能够在catch块中访问这个对象，以便更好地了解错误的性质。在ES6中，我们可以访问一些错误对象的属性，但是在ES10中，我们可以直接将错误对象绑定到一个变量中。

如何使用try-catch块可选绑定?

接下来让我们看看如何使用try-catch块可选绑定。假设我们在一个函数中调用了一个异步API，该API返回一个promise。我们可以使用then/catch块处理promise的成功/失败状态：

// javascriptcn.com 代码示例
async function fetchUserData(userId) {
  try {
    const response = await fetch(`/users/${userId}`);
    const userData = await response.json();
    // Process the user data
  } catch (error) {
    // Handle the error
  }
}

在catch块中，我们可以像以前一样访问错误对象的名称。但是，现在我们也可以将错误对象绑定到一个变量中：

// javascriptcn.com 代码示例
async function fetchUserData(userId) {
  try {
    const response = await fetch(`/users/${userId}`);
    const userData = await response.json();
    // Process the user data
  } catch ({ message }) {
    console.log(`Error: ${message}`);
    // Handle the error
  }
}

在这个例子中，我们将错误对象绑定到一个对象类型的参数（即一个形如{ message: string }的对象）上。然后我们可以访问error.message属性来输出错误信息，这比以前更简单。

另外，需要注意的是我们可以为参数指定默认值：

try {
  // ...
} catch ({ message = 'unknown error' }) {
  console.log(`Error: ${message}`);
}

当然，我们仍然可以访问错误对象的其他属性：

try {
  // ...
} catch (error) {
  console.log(`Error: ${error.message} (status=${error.status})`);
  // Handle the error
}

总结

try-catch块可选绑定是ES10中的一个令人兴奋的新特性，它为处理异步API中的错误提供了更简单的方法。上述例子只是一种可能的用法。当你开始使用这个特性时，会发现它真的很有用，并且可以使代码更加简洁。

来源：JavaScript中文网，转载请注明来源本文地址：https://www.javascriptcn.com/post/6545e8c67d4982a6ebf97f22