typescript 定义函数-JavaScript 和 Typescript 中的 Promise

bendan520 typescript

2023-09-05 0 8,363 百度已收录

立即下单

进入商城

进不了网站？换个网络试试！

HTTP 请求可以以干净且易于理解的方式处理。我们将使用 Axios 库来说明一个示例，它基本上与外部 fetch() 执行相同的操作：

import axios from "axios";
const API_URL = "dummyapithatdoesnotexist.com/data";
axios.get(API_URL)
  .then((response) => response.json())
  .then((jsonData) => console.log(jsonData)) // data from the API
  .catch((error) => console.log(`There has been an error: ${error}`));

请注意承诺末尾的“catch()”方法。 “catch()”用于处理尝试解决承诺时发生的任何错误。它非常有价值，也是异步操作的一个重要方面，因为它提供了异步操作失败原因的上下文（例如，当没有互联网连接或服务器关闭时）。

当然，还有其他可以使用 Promise 的场景，但是这个场景很好地说明了一个众所周知的场景。

JavaScript 和 Typescript 中的 Promise

你现在可能会问自己：但是……JavaScript 和 Typescript 中的 Promise 有什么区别？

嗯，当然，这是一个好问题，我们现在就来讨论它。

为了创建 Promise，JavaScript 和 TypeScript 都使用 Promise 构造函数，并且两种语言都使用 then() 方法来指示当 Promise 得到解决或拒绝时应该发生什么。

JavaScript Promise 和 TypeScript Promise 之间的一个重要区别是，在 TypeScript 中您使用更强大的类型检查，这有助于避免代码中的错误和错误。这避免了三天前仍然呕吐的混乱（到底出了什么问题？）。更强的类型允许您声明 Promise 将解析或拒绝的值的类型，而 JavaScript 依赖于运行时类型检查。在项目中使用 JavaScript 或 Typescript 时，这是需要记住的一个重要方面。

Typescript 中类型化 Promise 的示例如下所示：

import axios from "axios";
const API_URL: string = "dummyapithatdoesnotexist.com/data";
const myPromise: Promise = new Promise((resolve, reject) => {
  setTimeout(() => {
    resolve("Hey!My name is Bruno.");
  }, 3000);
});

当指定 then() 和 catch() 场景时，还可以按如下方式键入：

import axios from "axios";
const API_URL: string = "dummyapithatdoesnotexist.com/data";
axios.get(API_URL)
  .then((response: Response) => response.json())
  .then((jsonData: any) => console.log(jsonData)) // data from the API
  .catch((error: any) => console.log(`There has been an error: ${error}`));

在 Typescript 中typescript 定义函数，您还可以使用 async（它允许您指示操作是异步的）和 wait（它暂停函数的执行，直到承诺得到解决）。

import axios from 'axios';
const API_URL: string = 'dummyapithatdoesnotexist.com/data';
async function getData() {
  try {
    const response: AxiosResponse = await axios.get(API_URL);
    const jsonData: any = response.data;
    console.log(jsonData);
  } catch (error) {
    console.log(`There has been an error: ${error}`);
  }
}
getData(); // logs the data from the API

AxiosResponse 类型是从 axios 库导出的，用于输入本示例中的响应变量。要从 API 响应获取 JSON 数据，请使用 response.data 属性。 jsonData 变量是任意类型，表明它可以保存任意类型的值。 error 变量的类型也是any，这意味着它也可以是任何类型。

async 关键字将 getData() 函数标记为异步，而await 关键字则暂停函数的执行，直到 Promise 得到解决。如果请求期间发生错误，catch() 块会测量错误并将其记录到控制台。

谢谢阅读！

现在您已经了解了 JavaScript 和 Typescript 中 Promise 的所有来龙去脉，您现在应该能够以非类型化或类型化方式在代码中使用它们。恭喜typescript 定义函数，希望这有帮助！

收藏 (0) 打赏

感谢您的支持，我会继续努力的!