0%

Promise

Promise 翻译过来就是承诺的意思,这个承诺会在未来有一个确切的答复,并且该承诺有三种状态,分别是:

1、等待中(pending)
2、完成了 (resolved)
3、拒绝了(rejected)

这个承诺一旦从等待状态变成为其他状态就永远不能更改状态了,也就是说一旦状态变为 resolved 后,就不能再次改变

1
2
3
4
5
new Promise((resolve, reject) => {
resolve('success')
// 无效
reject('reject')
})

当我们在构造 Promise 的时候,构造函数内部的代码是立即执行的

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
new Promise((resolve, reject) => {
console.log('new Promise')
resolve('success')
})
console.log('finifsh')
// new Promise -> finifsh
Promise 实现了链式调用,也就是说每次调用 then 之后返回的都是一个 Promise,并且是一个全新的 Promise,原因也是因为状态不可变。如果你在 then 中 使用了 return,那么 return 的值会被 Promise.resolve() 包装

Promise.resolve(1)
.then(res => {
console.log(res) // => 1
return 2 // 包装成 Promise.resolve(2)
})
.then(res => {
console.log(res) // => 2
})

静态方法

1、Promise.resolve 返回一个fulfilled状态的promise对象

1
2
3
4
5
6
7
8
9
Promise.resolve('hello').then(function(value){
console.log(value);
});

Promise.resolve('hello');
// 相当于
const promise = new Promise(resolve => {
resolve('hello');
});

2、Promise.reject 返回一个rejected状态的promise对象

1
2
3
4
Promise.reject(24);
new Promise((resolve, reject) => {
reject(24);
});

3、Promise.all 接收一个promise对象数组为参数

只有全部为resolve才会调用 通常会用来处理 多个并行异步操作

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
const p1 = new Promise((resolve, reject) => {
resolve(1);
});

const p2 = new Promise((resolve, reject) => {
resolve(2);
});

const p3 = new Promise((resolve, reject) => {
resolve(3);
});

Promise.all([p1, p2, p3]).then(data => {
console.log(data); // [1, 2, 3] 结果顺序和promise实例数组顺序是一致的
}, err => {
console.log(err);
});

4、Promise.race 接收一个promise对象数组为参数

Promise.race 只要有一个promise对象进入 FulFilled 或者 Rejected 状态的话,就会继续进行后面的处理。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
function timerPromisefy(delay) {
return new Promise(function (resolve, reject) {
setTimeout(function () {
resolve(delay);
}, delay);
});
}
var startDate = Date.now();

Promise.race([
timerPromisefy(10),
timerPromisefy(20),
timerPromisefy(30)
]).then(function (values) {
console.log(values); // 10
});