JavaScript Promise详解

JavaScript Promise详解

Promise是异步编程的一种解决方案，比传统的解决方案——回调函数和事件——更合理和更强大。
所谓Promise，简单说就是一个容器，里面保存着某个未来才会结束的事件（通常是一个异步操作）的结果。
通俗讲，Promise是一个许诺、承诺,是对未来事情的承诺，承诺不一定能完成，但是无论是否能完成都会有一个结果。

构造器

//构造器如下
let promise = new Promise(function(resolve, reject) {
 // 承诺内容
});

1.构造器中的参数会带有一个执行函数，此函数会自带两个参数：
resolve《解决承诺》 reject《拒绝承诺》
2.我们需要通过执行函数（生产者代码）来改变promise对象的状态（即获取承诺的结果，无论是否成功都会有结果）
3.当 承诺内容 获得了结果，无论是早还是晚都没关系，它应该调用以下回调之一：
resolve(value) —— 如果任务成功完成并带有结果 value。
reject(error) —— 如果出现了 error，error 即为 error 对象。
4.承诺内容 只能调用一个 resolve 或一个 reject。任何状态的更改都是最终的且不可逆转的。所有其他的再对 resolve 和 reject 的调用都会被忽略
5.由 new Promise 构造器返回的 promise 对象具有以下内部属性：
state—— 最初是 “pending”，然后在 resolve 被调用时变为 “fulfilled”，或者在 reject 被调用时变为 “rejected”。
result —— 最初是 undefined，然后在 resolve(value) 被调用时变为 value，或者在 reject(error) 被调用时变为 error。

Promise对象的状态

一个promise对象只有三种状态:
等待（pending）、已完成（fulfilled）、已拒绝（rejected）
1 . 初始态pending

pending。它的意思是 “待定的，将发生的”，相当于是一个初始状态。创建Promise对象时，且没有调用resolve或者是reject方法，相当于是初始状态。这个初始状态会随着你调用resolve，或者是reject函数而切换到另一种状态。

这个初始状态可以理解为你对别人说出承诺的那个瞬间，此时，大家都不知道这个承诺是否能兑现。

2 . 成功态resolved–也叫fulfilled

resolved。表示解决了，就是说这个承诺实现了。 要实现从pending到resolved的转变，需要在 创建Promise对象时，在函数体中调用了resolve方法(即第一个参数)。

上面的resolve和reject仅是形参名而已。

3 . 失败态rejected

rejected。拒绝，失败。表示这个承诺没有做到，失败了。要实现从pending到rejected的转换，只需要在创建Promise对象时，调用reject函数。

简单示例

下面构造了两个promise对象通过分别执行resovle和reject来改变各自的state和result内部属性

let promise = new Promise(function(resolve,reject){
// 1 秒后发出工作已经被完成的信号，并带有state "fulfilled"  result "done"
setTimeout(() => resolve("done"), 1000);
})
			
let promise2 = new Promise(function(resolve,reject){
// 1 秒后发出工作已经被完成的信号，并带有state "fulfilled"  result "done"
setTimeout(() => reject(new Error("哦！我弹出了一个错误")), 1000);
})

拿取结果（Promise）

.then() catch() 与 .finally()

.then()

.then 的第一个参数是一个函数，该函数将在 promise resolved 且接收到结果后执行。
.then 的第二个参数也是一个函数，该函数将在 promise rejected 且接收到 error 信息后执行。
下方代码为两个promise对象执行then()方法(两个promise对象在上文中生成)

promise.then(
result => alert(result), // 1 秒后显示 "done!"
error => alert(error) // 不运行
);
promise2.then( result=>{alert(result)},error => alert(error))

.catch

.catch(err=>{})
如果我们只对 error 感兴趣，那么我们可以使用.then()函数并且 null 作为第一个参数：.then(null, errorHandlingFunction)。
或者我们也可以使用 .catch(errorHandlingFunction)，其实是一样的：
.catch(f) 调用是 .then(null, f) 的完全的模拟，它只是一个简写形式

.finally

无论执行是否成功 都会最终调用此函数。但需要注意的是finally 并不意味着处理一个 promise 的结果。如下代码所示 会先执行finally后执行then

new Promise((resolve, reject) => {
  setTimeout(() => resolve("value"), 2000)
})
  .finally(() => alert("Promise ready")) // 先触发
  .then(result => alert(result)); // <-- .then 显示 "value"

相关资料引用：
https://blog.csdn.net/Maybe__row/article/details/124534729