Node.js Promise的详细解析

一、Promise基础介绍

在JavaScript中，Promise是一种用于异步编程的技术，与回调函数相比，使用Promise编写的代码更加简洁易懂，而且支持链式调用，更加符合代码风格的美观优雅。

Promise是一种代表了未来某个时间点完成的可能性的对象，可以用来处理异步操作。Promise有三种状态，分别是“等待态”（pending）、“完成态”（fulfilled）和“拒绝态”（rejected），一旦Promise状态变为“完成态”或“拒绝态”，就不能再改变了。


//Promise的基本用法
const promise = new Promise((resolve, reject) => {
  //模拟异步操作
  setTimeout(() => {
    const data = {name: 'tom', age: 20}
    resolve(data) //异步操作成功时，调用resolve方法
    //reject('error') //异步操作失败时，调用reject方法
  }, 2000)
})
//使用Promise的then方法处理异步完成情况
promise.then((data) => {
  console.log(data)
}).catch((error) => {
  console.log(error)
})

二、Promise的链式调用

除了能够处理异步操作，Promise还具备一种非常强大的功能——链式调用，也称为Promise链。当需要对多个异步操作进行处理时，就可以使用Promise链。

通过链式调用，Promise对象可以根据成功或失败状态返回的值进行后续操作，实际上是then方法返回了一个新的Promise对象，因此可以连续使用then方法。


//Promise链式调用
const promise = new Promise((resolve, reject) => {
  setTimeout(() => {
    resolve(2)
  }, 2000)
})
promise.then((res) => {
  console.log(res) //2
  return res * 2
}).then((res) => {
  console.log(res) //4
  return Promise.resolve(res * 2)
}).then((res) => {
  console.log(res) //8
}).catch((error) => {
  console.log(error)
})

三、Promise.all()

当有多个异步操作需要执行，并且所有异步操作都完成后需要执行某种操作时，可以使用Promise.all()方法，该方法接收一个Promise对象数组，当所有对象状态都变为“完成态”时返回结果的数组，如果有一个对象状态变为“拒绝态”，则会直接跳转至catch()方法。

需要注意的是，Promise.all()方法返回的结果数组顺序与输入的Promise对象数组顺序相同。


//Promise.all()用法
const promise1 = Promise.resolve('Hello')
const promise2 = 10
const promise3 = new Promise((resolve, reject) => {
  setTimeout(resolve, 2000, 'Goodbye')
})
Promise.all([promise1, promise2, promise3]).then((values) => {
  console.log(values) //['Hello', 10, 'Goodbye']
}).catch((error) => {
  console.log(error)
})

四、Promise.race()

与Promise.all()类似，Promise.race()方法也是接收一个Promise对象数组，不同的是当任意一个Promise对象的状态变为“完成态”或“拒绝态”时，返回结果并结束操作。

需要注意的是，Promise.race()方法返回的结果是第一个完成或拒绝的Promise对象的结果。


//Promise.race()用法
const promise1 = new Promise((resolve, reject) => {
  setTimeout(resolve, 2000, 'Goodbye')
})
const promise2 = new Promise((resolve, reject) => {
  setTimeout(resolve, 1000, 'Hello')
})
Promise.race([promise1, promise2]).then((value) => {
  console.log(value) //'Hello'
}).catch((error) => {
  console.log(error)
})

五、async/await与Promise

ES2017发布了async/await语法，这是一个新的异步函数定型，可以让异步操作同步化，更加符合人们的正常思维方式。

async/await通过使函数返回一个Promise对象，让代码的执行顺序与Promise进行结合，可以让异步操作更加简单明了。


//async/await的基本用法
const fetchUserData = async (url) => {
  const response = await fetch(url) //等待异步操作完成
  const data = await response.json() //等待异步操作完成
  return data.name //返回结果
}
fetchUserData('https://api.github.com/users/octocat').then((data) => {
  console.log(data) //'The Octocat'
}).catch((error) => {
  console.log(error)
})

六、Promise的错误处理

当Promise对象状态变为“拒绝态”时，需要进行错误处理，可以通过在链式调用中使用catch()方法来完成。

需要注意的是，如果任何一个异步操作抛出错误或返回reject()方法，Promise对象会立即变为“拒绝态”状态，直接跳转至链式调用中的catch()方法，因此catch()方法需要放在链式调用的最后。


//Promise的错误处理
const promise = new Promise((resolve, reject) => {
  setTimeout(() => {
    reject('error')
  }, 2000)
})
promise.then((res) => {
  console.log(res)
}).catch((error) => {
  console.log(error) //'error'
})

原创文章，作者：CMLAP，如若转载，请注明出处：https://www.506064.com/n/361673.html