深入理解 `Promise`、`async/await` 与异步请求:以 `uni.request` 和 `axios` 为例

发布于:2025-03-05 ⋅ 阅读:(107) ⋅ 点赞:(0)

在现代 Web 开发中,异步操作是非常常见的需求,尤其是在进行 HTTP 请求时。无论是从服务器获取数据,还是提交表单,异步操作都可以让我们在不阻塞主线程的情况下完成这些任务。JavaScript 提供了多种方法来处理异步操作,其中最常见的就是使用 Promiseasync/await,以及基于 回调函数 的方式(如 uni.requestaxios)。这些方式使得我们能够更加方便地处理异步请求,尤其是随着 ES6 的发展,Promiseasync/await 让我们能够更加优雅地处理异步逻辑。

本文将通过 uni.requestaxios 来详细解释异步请求的工作原理,并深入讲解 Promise 的使用,以及如何通过 async/await 来简化异步代码的书写。


1. Promise 的基础概念与数据格式

什么是 Promise

Promise 是 JavaScript 中的一种机制,用于表示 异步操作。它代表了一个异步操作的最终完成(成功或失败),并允许我们在异步操作完成后处理结果。

Promise 主要有三种状态:

  • Pending(待定):表示 Promise 当前没有解决,也没有拒绝,处于等待状态。
  • Fulfilled(已解决):表示异步操作成功完成,Promise 返回了一个结果。
  • Rejected(已拒绝):表示异步操作失败,Promise 返回了一个错误信息。
Promise 的数据格式

Promise 的主要作用是传递异步操作的结果。它有两个核心方法:resolvereject,分别用于处理成功和失败的情况。

const promise = new Promise((resolve, reject) => {
   
  const isSuccess = true; // 假设这是异步操作的结果
  if (isSuccess) {
   
    resolve('Operation successful');  // 成功时调用 resolve
  } else {
   
    reject('Operation failed');  // 失败时调用 reject
  }
});
  • resolve(value):当异步操作成功时,调用 resolve 来返回成功的结果(value)。
  • reject(reason):当异步操作失败时,调用 reject 来返回失败的错误信息(reason)。
Promise 的使用:

Promise 返回的是一个 Promise 对象,可以使用 .then().catch() 来处理成功和失败的情况:

promise
  .then((result) => {
   
    console.log(result);  // 输出:'Operation successful'
  })
  .catch((error) => {
   
    console.error(error);  // 输出:'Operation failed'
  });

resolvereject 返回的数据可以是任何类型的值,通常是数据(如对象、数组、字符串等)或错误信息。

2. uni.request 的异步请求


网站公告

今日签到

点亮在社区的每一天
去签到