描述
Promise对象
通常用来表示一个异步操作的状态及结果值。
翻译成白话文有如下重点:
Promise对象
,是指一个对象,对象,对象。- 用来处理异步操作。
- 对象的数据结构自然是形如
key - value
格式的。它的两个key
可以简单的理解为是state
与result
,state
表示当前Promise对象
的状态,而result
表示当前Promise对象
的值。
一个Promise对象
必然处于三种状态之一:
- pending : 初始状态,没有成功,没有失败
new Promise(() => {}); // Promise {<pending>}
// 对象的数据结构可以简单的理解为 { state: 'pending', result: undefined }
- fulfilled : 操作成功完成
new Promise((resolve) => {
resolve(1);
}); // Promise {<fulfilled>: 1}
// 对象的数据结构可以简单的理解为 { state: 'fulfilled', result: 1 }
- rejected : 操作失败
new Promise((resolve, reject) => {
reject(1);
}); // Promise {<rejected>: 1}
// 对象的数据结构可以简单的理解为 { state: 'rejected', result: 1 }
看到了么,其多么的像一个有限状态机。
Promise对象
的状态可以由 pending 变为 fulfilled 或者 rejected , 无论是 fulfilled 或者 rejected , 该 Promise对象
的状态就已经确定并且不能更改了。
new Promise((resolve, reject) => {
resolve(1);
reject(1);
}); // Promise {<fulfilled>: 1}
Promise()
我们在书写代码时,一般类的命名我们会采用大写字母开头的驼峰命名法。而Promise
本身就是一个类。
来,让我们阅读以下代码:
const p = new Promise((resolve) => {
resolve(1);
});
这段代码,我们可以理解为:我们用 new运算符
实例化
了 Promise类
的一个 实例对象
p , 而 p 则是一个 Promise对象
。
Promise构造器
的参数是一个函数,这个函数拥有两个参数:resolve
函数 和 reject
函数。传入 Promise构造器
的入参函数会立即执行。
当我们在入参函数中调用 resolve
函数时,会将实例Promise对象
的状态值改为 fulfilled,并将传入给 resolve函数
的参数作为Promise对象
的结果值:
const p = new Promise((resolve) => {
resolve(1);
});
console.log(p);// Promise {<resolved>: 1}
当我们在入参函数中调用 reject
函数时,会将实例Promise对象
的状态值改为 rejected,并将传入给 reject函数
的参数作为Promise对象
的结果值:
const p = new Promise((resolve, reject) => {
reject(1);
});
console.log(p);// Promise {<rejected>: 1}
至于传递给Promise构造器
的函数的返回值,我个人理解为意义不是很大,规范中是这样讲到的:
Returning from the executor function does not mean that the deferred action has been completed but only that the request to eventually perform the deferred action has been accepted.
我其实不是很理解这段话想要表达什么意思。当我们在实践中,如果 return
操作在 调用 resolve
或者 reject
函数之前,那么 resolve
和 reject
函数并不会执行,那么通过构造器得到的实例Promise对象
其实是处在pending
状态的:
const p = new Promise((resolve, reject) => {
return 'completed';
resolve(1);
});
console.log(p); // Promise {<pending>}
而如果我们在调用 resolve
或者 reject
函数之后执行 return
操作,那么对我们的得到Promise对象
其实并不会产生什么影响:
const p = new Promise((resolve, reject) => {
resolve(1);
return 'completed';
});
console.log(p); // Promise {<resolved>: 1}
或许可以这么用?:
const fun = (resolve, reject) => {
resolve(1);
return 'completed';
};
const p = new Promise(fun);
console.log(p);
const funRes = fun(console.log);
console.log(funRes);
// Promise {<resolved>: 1}
// 1
// completed
在实践中,我确实没遇到过需要在Promise构造器
的入参函数中添加返回值的场景,如果有知道的同学,不妨留言分享。
结语
很久没写东西了,坚持确实是一件很困难的事情。本来计划在51之前就把Promise的内容写完的,但是懒癌发作,直到今天才写,而且我又机智的给它拆成了很多期,为未来挖坑其实不是一个好习惯。今年的年度宏观目标虽然已经完成,但是立下的技术目标却迟迟没有进展。在工作中虽然也在进步,但是确实没有将学习到的很多东西沉淀下来,未来还要争取再努力才行。