JavaScript中的Promise及其使用

Promise的基本概念

Promise是JavaScript中用于异步编程的一种解决方案，它代表了一个异步操作的最终完成（或失败）及其结果值。在ES6中被正式纳入标准，解决了传统回调函数嵌套的"回调地狱"问题。

Promise的三种状态

一个Promise对象必然处于以下三种状态之一：

pending：初始状态，既不是成功，也不是失败状态fulfilled：意味着操作成功完成rejected：意味着操作失败

// 创建Promiselet promise = new Promise((resolve, reject) => {  // 异步操作  setTimeout(() => {    const randomNum = Math.random();    if (randomNum > 0.5) {      resolve(randomNum); // 成功时调用    } else {      reject('Number too small'); // 失败时调用    }  }, 1000);});

Promise的基本用法

then方法

Promise实例的then()方法接收两个参数：

成功时的回调函数失败时的回调函数（可选）

promise.then(  value => {    console.log('Success:', value);  },  reason => {    console.log('Failure:', reason);  });

catch方法

catch()方法专门用于处理Promise被拒绝的情况。

promise  .then(value => {    console.log('Success:', value);  })  .catch(error => {    console.log('Error:', error);  });

finally方法

finally()方法无论Promise最终状态如何都会执行，适合做一些清理工作。

promise  .then(value => console.log(value))  .catch(error => console.error(error))  .finally(() => console.log('Operation completed'));

Promise的静态方法

Promise.resolve

快速创建一个已经resolve的Promise。

Promise.resolve('success').then(value => console.log(value));// 输出: "success"

Promise.reject

快速创建一个已经reject的Promise。

Promise.reject('failure').catch(reason => console.log(reason));// 输出: "failure"

Promise.all

等待所有Promise完成或其中任何一个失败。

const promise1 = Promise.resolve(3);const promise2 = 42;const promise3 = new Promise((resolve) => {  setTimeout(resolve, 100, 'foo');});Promise.all([promise1, promise2, promise3]).then(values => {  console.log(values); // [3, 42, "foo"]});

Promise.race

返回最快完成的Promise（无论成功或失败）。

const p1 = new Promise(resolve => setTimeout(resolve, 500, 'one'));const p2 = new Promise(resolve => setTimeout(resolve, 100, 'two'));Promise.race([p1, p2]).then(value => {  console.log(value); // "two"});

实际应用示例

// 模拟API请求function fetchUserData(userId) {  return new Promise((resolve, reject) => {    setTimeout(() => {      if (userId === '123') {        resolve({ id: '123', name: 'John Doe', age: 30 });      } else {        reject('User not found');      }    }, 1000);  });}// 使用Promise链式调用fetchUserData('123')  .then(user => {    console.log('User data:', user);    return user.age > 18;  })  .then(isAdult => {    console.log('Is adult:', isAdult);  })  .catch(error => {    console.error('Error:', error);  });

Promise为JavaScript异步编程提供了更清晰、更可控的方式，是现代前端开发中不可或缺的工具。掌握Promise的使用能够显著提升代码的可读性和可维护性。