promise出现的原因和promise方法

一、Promise出现的原因

背景

在JavaScript中，异步编程是非常常见的需求，例如处理网络请求、文件读取、定时操作等。在早期，我们通常使用回调函数（callback）来处理异步操作，但随着代码复杂度的增加，回调函数的使用也带来了一些问题，例如：

1. 回调地狱（Callback Hell）：
   当多个异步操作需要按顺序执行时，回调函数会嵌套得非常深，导致代码难以阅读和维护。

   1 2 3 4 5 6 7 8

   asyncOperation1(function(result1) { asyncOperation2(result1, function(result2) { asyncOperation3(result2, function(result3) { // 继续嵌套 }); }); });

2. 错误处理复杂：
   每个回调函数都需要单独处理错误，这使得代码更为冗长且不易统一管理。

Promise的引入

为了解决这些问题，ECMAScript 6（ES6）引入了Promise。Promise是一种用于管理异步操作的对象，提供了一种更为清晰和强大的方式来处理异步代码。

二、Promise的基本方法和用法

1. 创建一个Promise

你可以通过new Promise来创建一个Promise对象。它接受一个执行函数（executor），该函数有两个参数：resolve和reject。

1
2
3
4
5
6
7
8
9
10

let promise = new Promise(function(resolve, reject) {
    // 异步操作
    let success = true;
    if (success) {
        resolve("操作成功");
    } else {
        reject("操作失败");
    }
});

2. 使用Promise

Promise对象有三个主要方法：then、catch和finally，用于处理异步操作的结果。

• then：用于处理成功的结果。

  1 2 3 4

  promise.then(function(result) { console.log(result); // 操作成功 });

• catch：用于处理失败的结果。

  1 2 3 4

  promise.catch(function(error) { console.error(error); // 操作失败 });

• finally：无论Promise成功还是失败，最终都会执行的代码。

  1 2 3 4

  promise.finally(function() { console.log("操作完成"); });

3. 链式调用

Promise可以通过链式调用的方式来简化异步操作的串联，避免回调地狱。

1
2
3
4
5
6
7
8
9
10
11

asyncOperation1()
    .then(result1 => asyncOperation2(result1))
    .then(result2 => asyncOperation3(result2))
    .then(result3 => {
        // 处理最终结果
    })
    .catch(error => {
        // 统一处理错误
        console.error(error);
    });

4. 常见的Promise方法

• Promise.all：接收一个包含多个Promise的数组，只有当所有Promise都成功时，才会执行then，否则执行catch。

  1 2 3 4 5 6 7 8

  Promise.all([promise1, promise2, promise3]) .then(results => { // 所有Promise都成功 }) .catch(error => { // 任意一个Promise失败 });

• Promise.race：接收一个包含多个Promise的数组，只要有一个Promise成功或失败，就立即执行相应的then或catch。

  1 2 3 4 5 6 7 8

  Promise.race([promise1, promise2, promise3]) .then(result => { // 第一个成功的Promise }) .catch(error => { // 第一个失败的Promise });

总结

Promise提供了一种更为优雅和简洁的方式来处理JavaScript中的异步操作，解决了回调函数嵌套和错误处理复杂的问题。理解和掌握Promise对现代JavaScript编程至关重要。

Promise 的状态一旦确定（resolved 或 rejected），就无法更改。
同步代码先执行，Promise 回调是异步的，会在同步代码执行完毕后再执行。

1
2
3
4
5
6
7
8
9
10

console.log(1);
new Promise(function (resolve, reject) {
  reject();
  resolve();
}).then(function () {
  console.log(2);
}, function () {
  console.log(3);
});
console.log(4);

输出
1
4
3