promise笔记

promise
一，有三个状态
pedding（正在进行），fulfilled（执行成功），rejected（执行失败）
二，promise内含一个异步操作，异步操作控制promise状态改变
1，pedding到fulfilled
2，pedding到rejected
三，promise有两个参数，并且都是函数
1，resolve
当异步操作执行成功之后，执行resolve
并且修改promise状态为fulfilled
2，reject
当异步操作执行失败之后，执行reject
并且修改promise状态为reject

使用：
一，声明一个promise
1，字面量声明
var runAsync = new Promise(function(resolve, reject){
//做一些异步操作
setTimeout(function(){
console.log('执行完成');
resolve('随便什么数据');
}, 2000);
});
2，函数式声明
function runAsync(){
var p = new Promise(function(resolve, reject){
//做一些异步操作
setTimeout(function(){
console.log('执行完成');
resolve('随便什么数据');
}, 2000);
});
return p;
}
3，返回值式声明
function runAsync(ms) {
return new Promise((resolve, reject) => {
setTimeout(resolve, ms, 'done');
});
}
二，指定resolve回调函数
1，两步操作
runAsync.then(function(data){
console.log(data);
});
2，多步操作
function runAsync1(){
var p = new Promise(function(resolve, reject){
//做一些异步操作
setTimeout(function(){
console.log('异步任务1执行完成');
resolve('随便什么数据1');
}, 1000);
});
return p;
}
function runAsync2(){
var p = new Promise(function(resolve, reject){
//做一些异步操作
setTimeout(function(){
console.log('异步任务2执行完成');
resolve('随便什么数据2');
}, 2000);
});
return p;
}
function runAsync3(){
var p = new Promise(function(resolve, reject){
//做一些异步操作
setTimeout(function(){
console.log('异步任务3执行完成');
resolve('随便什么数据3');
}, 2000);
});
return p;
}
runAsync1()
.then(function(data){
console.log(data);
return runAsync2();
})
.then(function(data){
console.log(data);
return runAsync3();
})
.then(function(data){
console.log(data);
return '直接返回数据'; //这里直接返回数据
});

先执行runAsync1，成功后执行runAsync2，成功后执行runAsync3，同步执行三个异步操作

三，reject的用法
promise中有异步操作函数，在异步操作内部对数据进行判断，然后决定执行reject还是resolve
四，catch的用法
可以指定reject函数，和then的第二个参数一样作用，但是当then的第一个回调函数参数执行失败会直接进入catch并传入失败原因，不会直接报错。一般用catch作为失败原因输出，而不是then的第二个参数。
五，promise的all用法
作用是并行执行异步操作，异步操作全部执行完毕才开始执行回调函数
用法:
Promise
.all([runAsync1(), runAsync2(), runAsync3()])
.then(function(results){
console.log(results);//此处将上面三个异步操作的结果作为一个数组输出作为结果
});
使用场景：用于资源的加载，所有的都加载完后，我们再进行页面的初始化。

六，race的用法
all是全部的异步操作执行完毕，才开始执行then。race是第一个异步操作执行完毕就立马执行then的回调函数，若是第一个异步操作没有跑赢后面的异步操作，那么会进入catch执行。
例如：
//请求某个图片资源
function requestImg(){
var p = new Promise(function(resolve, reject){
var img = new Image();
img.onload = function(){
resolve(img);
}
img.src = 'xxxxxx';
});
return p;
}

//延时函数，用于给请求计时
function timeout(){
var p = new Promise(function(resolve, reject){
setTimeout(function(){
reject('图片请求超时');
}, 5000);
});
return p;
}

Promise
.race([requestImg(), timeout()])
.then(function(results){
console.log(results);
})
.catch(function(reason){
console.log(reason);
});

声明两个promise异步操作，若是请求图片快于超时的先执行完，那么执行then，反之执行catch

 promise在声明后会立即执行

 

详细：https://www.cnblogs.com/whybxy/p/7645578.html