promise
Promise
对象代表一个异步操作,有三种状态:pending
(进行中)、fulfilled(
resolved)
(已成功)和rejected
(已失败)。
就可以将异步操作以同步操作的流程表达出来,避免了层层嵌套的回调函数。此外,Promise
对象提供统一的接口,使得控制异步操作更加容易。then方法回调中需要获取异步操作中的值,并且依赖于promise对象的resolved或者rejected抛出的对象
const promise = new Promise(function(resolve, reject) {
if (判断){
resolve(value);
} else {
reject(error);
}
});
promise.then(function(value) {//接受resolve成功状态数据
// success
}, function(error) {//接受rejected失败状态数据
// failure
});
function timeout(ms) {
return new Promise((resolve, reject) => {
setTimeout(resolve, ms, 'done it you want do');//异步操作,
});
}
timeout(1000).then((value) => {
console.log(value);
});
Promise 新建后就会立即执行。
async函数
用来表示函数是异步的,定义的函数会返回一个promise对象,可以使用then方法添加回调函数。
async function asyFun() {
return '----';
}
asyFun().then(val => {
console.log(val);// '----'
});
若 async 定义的函数有返回值,return '----';相当于Promise.resolve('----'),没有声明式的 return则相当于执行了Promise.resolve();
await 可以理解为是 async wait 的简写。await 必须出现在 async 函数内部,不能单独使用。
await 后面可以跟任何的JS 表达式。虽然说 await 可以等很多类型的东西,但是它最主要的意图是用来等待 Promise 对象的状态被 resolved。如果await的是 promise对象会造成异步函数停止
执行并且等待
promise 的解决,如果等的是正常的表达式则立即执行。
function sleep(second) {var oldDate=new Date();var newDate=0;
return new Promise((resolve, reject) => {
setTimeout(() => {
resolve('request done! ' + Math.random());
newDate=new Date();
console.log(newDate-oldDate);
}, second);
})
}
async function bugDemo() {
await sleep(1000).then((value)=>{console.log(value)});
await sleep(1000).then((value)=>{console.log(value)});
await sleep(1000).then((value)=>{console.log(value)});
console.log('clear the loading~');
}
bugDemo();
打印如下:
Promise {}__proto__: Promise[[PromiseStatus]]: "resolved"[[PromiseValue]]: undefined
VM72:4 1012
VM72:4 1004
VM72:4 1016
VM72:13 clear the loading~