VUE-Promise介绍

VUE-Promise介绍

一、简介

• Promise 翻译为承诺，是一种用于处理异步操作的对象；
• 表示一个在未来某个时刻会产生一个值的操作，比如发起网络请求、处理定时器等；

二、特点

• 一个Promise可以处于以下三个状态中的一个：

  • Pending（进行中）: 初始状态，表示操作尚未完成，处于等待状态。
  • Fulfilled（已成功）: 表示操作成功完成，Promise 返回了一个值。
  • Rejected（已失败）: 表示操作失败，Promise 返回了一个错误。

• 主要有以下两个特点：

  • 状态不可逆转: 一旦状态从 Pending 变为 Fulfilled 或 Rejected，就不可逆转。这保证了一旦异步操作完成，就能够得到明确的结果。
  • 链式调用: Promise 提供了 then 方法，使得可以链式调用多个异步操作，增加代码的可读性。

三、用法

• 使用构造函数来生成Promise实例：

  const promise = newPromise(function(resolve, reject) {});
  

• 该构造函数接收一个函数作为参数，该函数的两个参数分别是resolve和reject:

  • resolve函数的作用是，将Promise对象的状态从“未完成”变为“成功”;
  • reject函数的作用是，将Promise对象的状态从“未完成”变为“失败”;

• 示例：

  function fetchData() {
    return new Promise((resolve, reject) => {
      // 模拟异步请求
      setTimeout(() => {
        const success = true; // 模拟请求是否成功的标志
        if (success) {
          resolve('Data fetched successfully');
        } else {
          reject('Error fetching data');
        }
      }, 1000); // 模拟1秒的延迟
    });
  }
  
  // 使用 Promise 处理异步请求
  fetchData()
    .then(data => {//Pending ==> Fulfilled（成功）
      console.log(data); // 输出: Data fetched successfully
    })
    .catch(error => {//Pending ==> Rejected（已失败）
      console.error(error); // 输出: Error fetching data
    });