Promise
Promise的初体验
具体看html文件中写的
Promise的状态
-
实例对象中的一个属性PromiseState
-
pending 未决定的
-
resolve / fullfilled 成功
-
rejected 失败
状态的改变只有两种形式：
-
pending 变为 resolved
-
pending 变为 rejected
说明：只有这两种状态 且一个promise对象只能改变一次 无论变为成功还是失败 都会有一个结果数据 成功的结果数据一般称为value 失败的结果数据一般称为resaon
Promise对象的值
-
实例对象中的另一个属性PromiseResult
-
保存着异步任务成功/失败的结果
-
resolve 和 reject 这两个函数可以对其进行修改(传参) 其他的是不可以的
Promise的工作流程
Promise API
Promise构造函数:Promise(excutor{})
-
excutor函数：执行器 （resolve,reject）=> { }
-
resolve函数：内部定义成功时我们调用的函数 value => { }
-
reject函数：内部定义失败时我们调用的函数 reason => { }
说明：excutor会在内部立即同步调用，异步操作在执行器中调用
let p = new Promise((resolve,reject)=>{
// 同步调用的
console.log(111)
})
console.log(222) 
Promise.prototype.then方法:(onResolved,onRejected)=>{}
-
onResolved函数：成功的回调函数（value）=> {}
-
onRejected函数：失败的回调函数（reason）=>{}
说明：指定用于得到成功value的成功回调和用于得到失败reason的失败回调 返回一个新的promise对象
Promise.prototype.catch方法:(onRejected)=>{}
-
onRejected函数：失败的回调函数（reason）=>{}
let p = new Promise((resolve,reject)=>{
// 修改promise对象的状态
reject('error')
})
// 执行 catch方法
p.catch(reason =>{
console.log(reason)
})
promise.resolve方法:(value)=>{}
-
value：成功的数据或者promise对象
说明：返回一个成功/失败的promise对象
let p1 = Promise.resolve(521);
//如果传入的参数为 非Promise类型的对象, 则返回的结果为成功promise对象
//如果传入的参数为 Promise 对象, 则参数的结果决定了 resolve 的结果
let p2 = Promise.resolve(new Promise((resolve, reject) => {
// resolve('OK');
reject('Error');
}));
// console.log(p1);
// console.log(p2);
p2.catch(reason => {
console.log(reason);
})Promise.reject方法:(reason)=>{}
-
reason：失败的原因
说明：返回一个失败的promise对象
let p = Promise.reject(123)
let p1 = Promise.reject(new Promise((resolve,reject)=>{
resolve("ok")
}))
console.log(p)
console.log(p1)//不管传入什么都是失败
Promise.all方法:(promises)=>{}
-
promises:包含n个promise的数组
说明：返回一个新的promise 只有所有的promise都成功才成功 只要有一个失败就直接失败
-
成功：返回的结果是一个成功的数组
let p1 = new Promise((resolve,reject)=>{
resolve("ok")
})
let p2 = Promise.resolve("SUCCESS")
let p3 = Promise.resolve("oh Yeah")
const result = Promise.all([p1,p2,p3])
console.log(result) 
-
失败:返回的失败的结果值
let p1 = new Promise((resolve,reject)=>{
resolve("ok")
})
// let p2 = Promise.resolve("SUCCESS")
let p2 = Promise.reject("error")
let p3 = Promise.resolve("oh Yeah")
const result = Promise.all([p1,p2,p3])
console.log(result) 
Promise.race方法:(promises)=>{}
-
promises：包含n个promise的数组
说明：返回一个新的promise 第一个完成的promise的结果状态就是最终的状态 返回的结果就是数组中第一个promise的结果
let p1 = new Promise((resolve,reject)=>{
resolve("ok")
})
// let p2 = Promise.resolve("SUCCESS")
let p2 = Promise.reject("error")
let p3 = Promise.resolve("oh Yeah")
let result = Promise.race([p2,p1,p3])
console.log(result) 
Promise的几个关键问题
如何改变 promise 的状态?
-
resolve(value): 如果当前是 pending 就会变为 resolved
-
reject(reason): 如果当前是 pending 就会变为 rejected
-
抛出异常: 如果当前是 pending 就会变为 rejected
let p = new Promise((resolve, reject) => {
// 1.resolve
// resolve('ok') //pending => fulfilled(resolved)
// 2.reject
// reject('err') //pending => rejected
// 3.抛出错误
// throw '出问题了'
});
console.log(p);一个 promise 指定多个成功/失败回调函数, 都会调用吗?
-
当 promise 改变为对应状态时都会调用
let p = new Promise((resolve, reject) => {
resolve('OK');
//当注释掉这个resolve()时 这个p的状态没有发生改变 所以不会执行回调
//！！！！只有当promise的对应状态改变时才会发生回调
});
///指定回调 - 1
p.then(value => {
console.log(value);
});
//指定回调 - 2
p.then(value => {
alert(value);
});改变 promise 状态和指定回调函数谁先谁后?
题意：promise代码在运行时 改变状态(resolve()/reject())先执行 还是 then方法先执行
-
都有可能, 正常情况下是先指定回调再改变状态, 但也可以先改状态再指定回调
-
如何先改状态再指定回调?
-
在执行器中直接调用 resolve()/reject()
-
延迟更长时间才调用 then()
-
-
什么时候才能得到数据?
-
如果先指定的回调, 那当状态发生改变时, 回调函数就会调用, 得到数据 （这种是加了定时器的 意思是：会先去执行then方法 然后回过头来resolve()改变状态 然后再去执行then里面的代码获取数据）（指定回调->改变状态->执行回调）
-
如果先改变的状态, 那当指定回调时, 回调函数就会调用, 得到数据 （改变状态->指定回调->执行回调）
-
let p = new Promise((resolve, reject) => {
// setTimeout(() => {
resolve('OK');
// }, 1000);
});
p.then(value => {
console.log(value);
},reason=>{
}) // 1.不加定时器的话 因为是同步任务 先会执行resolve改变状态 然后执行then方法 一般来说都是第一种 // 2.加定时器的话 变成了异步任务 会先调用then方法 然后resolve改变状态 然后再执行then方法 //天王老子来了都是先变状态再执行回调
promise.then()返回的新 promise 的结果状态由什么决定?
-
简单表达: 由 then()指定的回调函数执行的结果决定
-
详细表达:
-
如果抛出异常, 新 promise 变为 rejected, reason 为抛出的异常
-
如果返回的是非 promise 的任意值, 新 promise 变为 resolved, value 为返回的值
-
如果返回的是另一个新 promise, 此 promise 的结果就会成为新 promise 的结果
-
let p = new Promise((resolve, reject) => {
resolve('ok');
});
//执行 then 方法
let result = p.then(value => {
console.log(value);
//1. 抛出错误
// throw '出了问题';
//2. 返回结果是非 Promise 类型的对象
// return 521;
//3. 返回结果是 Promise 对象
return new Promise((resolve, reject) => {
resolve('success');
// reject('error');
});
}, reason => {
console.warn(reason);
});
console.log(result);promise 如何串连多个操作任务?
-
promise 的 then()返回一个新的 promise, 可以开成 then()的链式调用
-
通过 then 的链式调用串连多个同步/异步任务
let p = new Promise((resolve, reject) => {
setTimeout(() => {
resolve('OK');
}, 1000);
});
p.then(value => {
return new Promise((resolve, reject) => {
resolve("success");
});
}).then(value => {
console.log(value);
}).then(value => {
console.log(value);
}) 
promise 异常传透?
-
当使用 promise 的 then 链式调用时, 可以在最后指定失败的回调,
-
前面任何操作出了异常, 都会传到最后失败的回调中处理
let p = new Promise((resolve, reject) => {
setTimeout(() => {
resolve('OK');
// reject('Err');
}, 1000);
});
p.then(value => {
// console.log(111);
throw '失败啦!';
}).then(value => {
console.log(222);
}).then(value => {
console.log(333);
}).catch(reason => {
console.warn(reason);
}); 
中断 promise 链?
-
有且只有一个方式 返回一个pending状态的Promise！！！！ 因为！！只有状态发生改变 才会执行then回调 pending状态没有发生改变 所以接下来的链式promise会被中断
let p = new Promise((resolve, reject) => {
setTimeout(() => {
resolve('OK');
}, 1000);
});
p.then(value => {
console.log(111);
//有且只有一个方式
return new Promise(() => {});
}).then(value => {
console.log(222);
}).then(value => {
console.log(333);
}).catch(reason => {
console.warn(reason);
});Promise自定义封装(手写Promise)
自定义封装resolve 和 rejected
//声明构造函数
function Promise(executor){
//添加属性
this.PromiseState = 'pending';
this.PromiseResult = null;
//保存实例对象的 this 的值
const self = this;// self _this that
//resolve 函数
function resolve(data){
//1. 修改对象的状态 (promiseState)
self.PromiseState = 'fulfilled';// resolved
//2. 设置对象结果值 (promiseResult)
self.PromiseResult = data;
}
//reject 函数
function reject(data){
//1. 修改对象的状态 (promiseState)
self.PromiseState = 'rejected';//
//2. 设置对象结果值 (promiseResult)
self.PromiseResult = data;
}
//同步调用『执行器函数』
executor(resolve, reject);
}
//添加 then 方法
Promise.prototype.then = function(onResolved, onRejected){
}抛出异常改变状态
try{
//同步调用『执行器函数』
executor(resolve, reject);
}catch(e){
//修改 promise 对象状态为『失败』
reject(e);
}Promise对象的状态只能修改一次
-
原来的Promise对象
let p = new Promise((resolve, reject) => {
reject("error");
resolve('OK');
//抛出异常
// throw "error";
});
//这个改变的两次状态 按照原来的Promise对象 then方法输出的是error 状态是rejected 只能改变一次状态 所以下面的resolve不会执行 手写Promise下面的代码块可以实现这个功能
if(self.PromiseState !== 'pending') return;then方法执行回调
//添加 then 方法
Promise.prototype.then = function(onResolved, onRejected){
//调用回调函数 PromiseState
if(this.PromiseState === 'fulfilled'){
onResolved(this.PromiseResult);
}
if(this.PromiseState === 'rejected'){
onRejected(this.PromiseResult);
}
}异步任务回调的执行
//实例化对象
let p = new Promise((resolve, reject) => {
setTimeout(() => {
// resolve('OK');
reject("error");
}, 1000);
});
p.then(value => {
console.log(value);
}, reason=>{
console.warn(reason);
});
console.log(p);因为上面重写到Promise的步骤是只有状态改变了才会执行then方法，上面的html代码 先会执行回调发现状态还是pending 没有改变 等到一秒后resolve异步执行时 then方法早已执行过了 所以没有任何的输出
-
修改后
//在Promise中加一个callback属性
this.callback = {};
//在resolve函数中
//调用成功的回调函数
if(self.callback.onResolved){
self.callback.onResolved(data);
}
//失败的回调函数中同上
//then方法中
//判断 pending 状态
if(this.PromiseState === 'pending'){
//保存回调函数
this.callback = {
onResolved: onResolved,
onRejected: onRejected
}
}指定多个回调的实现
按照上面的代码callback是一个对象 如果执行多个then方法 下面的then方法会将上面的覆盖掉 只会输出最后一个then的回调
p.then(value => {
console.log(value);
}, reason=>{
console.warn(reason);
});
p.then(value => {
alert(value);
}, reason=>{
alert(reason);
});-
修改后 将callback变为一个数组 就可以执行多个回调了
this.callbacks = [];
//调用成功的回调函数
self.callbacks.forEach(item => {
item.onResolved(data);
});
//执行失败的回调
self.callbacks.forEach(item => {
item.onRejected(data);
});
//判断 pending 状态
if(this.PromiseState === 'pending'){
//保存回调函数
this.callbacks.push({
onResolved: onResolved,
onRejected: onRejected
});
}同步修改状态then方法结果返回
有点绕
-
在then方法中让它的返回值是一个Promise
return new Promise -
判断then的返回值
-
上面这一块的东西就是等价于
let result = onResolved(this.PromiseResult);就是判断它return的返回值是什么 （没有返回值 返回的就是undefined） -
判断这个返回值是不是promise 再进行响应的操作
//添加 then 方法
Promise.prototype.then = function(onResolved, onRejected){
return new Promise((resolve, reject) => {
//调用回调函数 PromiseState
if(this.PromiseState === 'fulfilled'){
try{
//获取回调函数的执行结果
let result = onResolved(this.PromiseResult);
//判断
if(result instanceof Promise){
//如果是 Promise 类型的对象
result.then(v => {
resolve(v);
}, r=>{
reject(r);
})
}else{
//结果的对象状态为『成功』
resolve(result);
}
}catch(e){
reject(e);
}
}
if(this.PromiseState === 'rejected'){
onRejected(this.PromiseResult);
}
//判断 pending 状态
if(this.PromiseState === 'pending'){
//保存回调函数
this.callbacks.push({
onResolved: onResolved,
onRejected: onRejected
});
}
})
}异步修改状态then方法结果返回
修改前
//实例化对象
let p = new Promise((resolve, reject) => {
setTimeout(() => {
resolve('OK');
}, 1000)
});
//执行 then 方法
const res = p.then(value => {
console.log(value)
}, reason=>{
});
console.log(res);-
修改前的代码因为异步 会先执行then方法 因为状态没有改变 所以
PromiseState = pending
-
因为这里没有resolve 和 reject 所以then的状态没有发生改变 所以
console.log(res)还是pending
修改后
//判断 pending 状态
if(this.PromiseState === 'pending'){
//保存回调函数
this.callbacks.push({
onResolved: function(){
try{
//执行成功回调函数
let result = onResolved(self.PromiseResult);
//判断
if(result instanceof Promise){
result.then(v => {
resolve(v);
}, r=>{
reject(r);
})
}else{
resolve(result);
}
}catch(e){
reject(e);
}
},
onRejected: function(){
try{
//执行成功回调函数
let result = onRejected(self.PromiseResult);
//判断
if(result instanceof Promise){
result.then(v => {
resolve(v);
}, r=>{
reject(r);
})
}else{
resolve(result);
}
}catch(e){
reject(e);
}
}
});
}then方法的完善与优化
-
因为下面这一块的代码重复使用 所以将这块代码封装一样 好维护
//添加 then 方法
Promise.prototype.then = function(onResolved, onRejected){
const self = this;
return new Promise((resolve, reject) => {
//封装函数
function callback(type){
try{
//获取回调函数的执行结果
let result = type(self.PromiseResult);
//判断
if(result instanceof Promise){
//如果是 Promise 类型的对象
result.then(v => {
resolve(v);
}, r=>{
reject(r);
})
}else{
//结果的对象状态为『成功』
resolve(result);
}
}catch(e){
reject(e);
}
}
//调用回调函数 PromiseState
if(this.PromiseState === 'fulfilled'){
callback(onResolved);
}
if(this.PromiseState === 'rejected'){
callback(onRejected);
}
//判断 pending 状态
if(this.PromiseState === 'pending'){
//保存回调函数
this.callbacks.push({
onResolved: function(){
callback(onResolved);
},
onRejected: function(){
callback(onRejected);
}
});
}
})
}catch方法 异常穿透与值传递
catch方法实现
//添加 catch 方法
Promise.prototype.catch = function(onRejected){
return this.then(undefined, onRejected);
}异常穿透
因为这个then没有传失败 reason的回调 所以then的第二个参数就变成了 undefined 所以在我们写的代码中 onRejected就不是一个函数了它是undefined
-
就变成了 undefined(self.PromiseResult) 就会报错
修改后
-
//判断回调函数参数 if(typeof onRejected !== 'function'){ onRejected = reason => { throw reason; } }
值传递（与异常穿透同理）
if(typeof onResolved !== 'function'){
onResolved = value => value;
//value => { return value};
}Promise.resolve的封装
-
返回的状态的成功与失败 取决于传进来的值或者Promise的成功与失败
//添加 resolve 方法
Promise.resolve = function(value){
//返回promise对象
return new Promise((resolve, reject) => {
if(value instanceof Promise){
value.then(v=>{
resolve(v);
}, r=>{
reject(r);
})
}else{
//状态设置为成功
resolve(value);
}
});
}Promise.reject的封装
-
无论传进来的是什么 返回的都是失败的Promise
//添加 reject 方法
Promise.reject = function(reason){
return new Promise((resolve, reject)=>{
reject(reason);
});
}Promise.all的封装
-
只有全部成功 才返回成功的Promise 值为数组
-
有一个失败 就返回失败的Promise 值为那个失败的resason
//添加 all 方法
Promise.all = function(promises){
//返回结果为promise对象
return new Promise((resolve, reject) => {
//声明变量
let count = 0;
let arr = [];
//遍历
for(let i=0;i<promises.length;i++){
//
promises[i].then(v => {
//得知对象的状态是成功
//每个promise对象 都成功
count++;
//将当前promise对象成功的结果 存入到数组中
arr[i] = v;
//判断
if(count === promises.length){
//修改状态
resolve(arr);
}
}, r => {
reject(r);
});
}
});
}Promise.race的封装
-
谁先改变状态 返回的就是谁
//添加 race 方法
Promise.race = function(promises){
return new Promise((resolve, reject) => {
for(let i=0;i<promises.length;i++){
promises[i].then(v => {
//修改返回对象的状态为 『成功』
resolve(v);
},r=>{
//修改返回对象的状态为 『失败』
reject(r);
})
}
});
}then方法回调的异步执行
let p1 = new Promise((resolve, reject) => {
resolve('OK');
console.log(111);
});
p1.then(value => {
console.log(222);
}, reason => {
console.log(444);
});
console.log(333);
//上面这代码 执行输出的结果应该是
// 111 333 222
//then方法应该是异步执行的-
所以我们要在Promise中给then成功失败的回调加上延时器
!!!!手写Promise的全部代码
//声明构造函数
function Promise(executor){
//添加属性
this.PromiseState = 'pending';
this.PromiseResult = null;
//声明属性
this.callbacks = [];
//保存实例对象的 this 的值
const self = this;// self _this that
//resolve 函数
function resolve(data){
//判断状态
if(self.PromiseState !== 'pending') return;
//1. 修改对象的状态 (promiseState)
self.PromiseState = 'fulfilled';// resolved
//2. 设置对象结果值 (promiseResult)
self.PromiseResult = data;
//调用成功的回调函数
setTimeout(() => {
self.callbacks.forEach(item => {
item.onResolved(data);
});
});
}
//reject 函数
function reject(data){
//判断状态
if(self.PromiseState !== 'pending') return;
//1. 修改对象的状态 (promiseState)
self.PromiseState = 'rejected';//
//2. 设置对象结果值 (promiseResult)
self.PromiseResult = data;
//执行失败的回调
setTimeout(() => {
self.callbacks.forEach(item => {
item.onRejected(data);
});
});
}
try{
//同步调用『执行器函数』
executor(resolve, reject);
}catch(e){
//修改 promise 对象状态为『失败』
reject(e);
}
}
//添加 then 方法
Promise.prototype.then = function(onResolved, onRejected){
const self = this;
//判断回调函数参数
if(typeof onRejected !== 'function'){
onRejected = reason => {
throw reason;
}
}
if(typeof onResolved !== 'function'){
onResolved = value => value;
//value => { return value};
}
return new Promise((resolve, reject) => {
//封装函数
function callback(type){
try{
//获取回调函数的执行结果
let result = type(self.PromiseResult);
//判断
if(result instanceof Promise){
//如果是 Promise 类型的对象
result.then(v => {
resolve(v);
}, r=>{
reject(r);
})
}else{
//结果的对象状态为『成功』
resolve(result);
}
}catch(e){
reject(e);
}
}
//调用回调函数 PromiseState
if(this.PromiseState === 'fulfilled'){
setTimeout(() => {
callback(onResolved);
});
}
if(this.PromiseState === 'rejected'){
setTimeout(() => {
callback(onRejected);
});
}
//判断 pending 状态
if(this.PromiseState === 'pending'){
//保存回调函数
this.callbacks.push({
onResolved: function(){
callback(onResolved);
},
onRejected: function(){
callback(onRejected);
}
});
}
})
}
//添加 catch 方法
Promise.prototype.catch = function(onRejected){
return this.then(undefined, onRejected);
}
//添加 resolve 方法
Promise.resolve = function(value){
//返回promise对象
return new Promise((resolve, reject) => {
if(value instanceof Promise){
value.then(v=>{
resolve(v);
}, r=>{
reject(r);
})
}else{
//状态设置为成功
resolve(value);
}
});
}
//添加 reject 方法
Promise.reject = function(reason){
return new Promise((resolve, reject)=>{
reject(reason);
});
}
//添加 all 方法
Promise.all = function(promises){
//返回结果为promise对象
return new Promise((resolve, reject) => {
//声明变量
let count = 0;
let arr = [];
//遍历
for(let i=0;i<promises.length;i++){
//
promises[i].then(v => {
//得知对象的状态是成功
//每个promise对象 都成功
count++;
//将当前promise对象成功的结果 存入到数组中
arr[i] = v;
//判断
if(count === promises.length){
//修改状态
resolve(arr);
}
}, r => {
reject(r);
});
}
});
}
//添加 race 方法
Promise.race = function(promises){
return new Promise((resolve, reject) => {
for(let i=0;i<promises.length;i++){
promises[i].then(v => {
//修改返回对象的状态为 『成功』
resolve(v);
},r=>{
//修改返回对象的状态为 『失败』
reject(r);
})
}
});
}Class封装Promise
class Promise{
//构造方法
constructor(executor){
//添加属性
this.PromiseState = 'pending';
this.PromiseResult = null;
//声明属性
this.callbacks = [];
//保存实例对象的 this 的值
const self = this;// self _this that
//resolve 函数
function resolve(data){
//判断状态
if(self.PromiseState !== 'pending') return;
//1. 修改对象的状态 (promiseState)
self.PromiseState = 'fulfilled';// resolved
//2. 设置对象结果值 (promiseResult)
self.PromiseResult = data;
//调用成功的回调函数
setTimeout(() => {
self.callbacks.forEach(item => {
item.onResolved(data);
});
});
}
//reject 函数
function reject(data){
//判断状态
if(self.PromiseState !== 'pending') return;
//1. 修改对象的状态 (promiseState)
self.PromiseState = 'rejected';//
//2. 设置对象结果值 (promiseResult)
self.PromiseResult = data;
//执行失败的回调
setTimeout(() => {
self.callbacks.forEach(item => {
item.onRejected(data);
});
});
}
try{
//同步调用『执行器函数』
executor(resolve, reject);
}catch(e){
//修改 promise 对象状态为『失败』
reject(e);
}
}
//then 方法封装
then(onResolved,onRejected){
const self = this;
//判断回调函数参数
if(typeof onRejected !== 'function'){
onRejected = reason => {
throw reason;
}
}
if(typeof onResolved !== 'function'){
onResolved = value => value;
//value => { return value};
}
return new Promise((resolve, reject) => {
//封装函数
function callback(type){
try{
//获取回调函数的执行结果
let result = type(self.PromiseResult);
//判断
if(result instanceof Promise){
//如果是 Promise 类型的对象
result.then(v => {
resolve(v);
}, r=>{
reject(r);
})
}else{
//结果的对象状态为『成功』
resolve(result);
}
}catch(e){
reject(e);
}
}
//调用回调函数 PromiseState
if(this.PromiseState === 'fulfilled'){
setTimeout(() => {
callback(onResolved);
});
}
if(this.PromiseState === 'rejected'){
setTimeout(() => {
callback(onRejected);
});
}
//判断 pending 状态
if(this.PromiseState === 'pending'){
//保存回调函数
this.callbacks.push({
onResolved: function(){
callback(onResolved);
},
onRejected: function(){
callback(onRejected);
}
});
}
})
}
//catch 方法
catch(onRejected){
return this.then(undefined, onRejected);
}
//添加 resolve 方法
static resolve(value){
//返回promise对象
return new Promise((resolve, reject) => {
if(value instanceof Promise){
value.then(v=>{
resolve(v);
}, r=>{
reject(r);
})
}else{
//状态设置为成功
resolve(value);
}
});
}
//添加 reject 方法
static reject(reason){
return new Promise((resolve, reject)=>{
reject(reason);
});
}
//添加 all 方法
static all(promises){
//返回结果为promise对象
return new Promise((resolve, reject) => {
//声明变量
let count = 0;
let arr = [];
//遍历
for(let i=0;i<promises.length;i++){
//
promises[i].then(v => {
//得知对象的状态是成功
//每个promise对象 都成功
count++;
//将当前promise对象成功的结果 存入到数组中
arr[i] = v;
//判断
if(count === promises.length){
//修改状态
resolve(arr);
}
}, r => {
reject(r);
});
}
});
}
//添加 race 方法
static race (promises){
return new Promise((resolve, reject) => {
for(let i=0;i<promises.length;i++){
promises[i].then(v => {
//修改返回对象的状态为 『成功』
resolve(v);
},r=>{
//修改返回对象的状态为 『失败』
reject(r);
})
}
});
}
} async 和 await
async函数
-
在函数的前面加了async 则这个函数返回的结果就是一个Promise 成功与失败取决于return的类型以及值(它跟then方法返回的结果是一样的)
async function main(){
//1. 如果返回值是一个非Promise类型的数据
// return 521;
//2. 如果返回的是一个Promise对象
// return new Promise((resolve, reject) => {
// // resolve('OK');
// reject('Error');
// });
//3. 抛出异常
throw "Oh NO";
}
let result = main();
console.log(result); 
await表达式
-
await 右侧的表达式一般为 promise 对象, 但也可以是其它的值
-
如果表达式是 promise 对象, await 返回的是 promise 成功的值
-
如果表达式是其它值, 直接将此值作为 await 的返回值
-
！！await主要是获取Promise成功的结果 如果Promise返回的是失败的结果 则会抛出一个错误 需要用try catch来返回失败的结果
async function main(){
let p = new Promise((resolve, reject) => {
// resolve('OK');
reject('Error');
})
//1. 右侧为promise的情况
// let res = await p;
//2. 右侧为其他类型的数据
// let res2 = await 20;
//3. 如果promise是失败的状态
try{
let res3 = await p;
}catch(e){
console.log(e);
}
}
main();注意
-
await 必须写在 async 函数中, 但 async 函数中可以没有 await
-
如果 await 的 promise 失败了, 就会抛出异常, 需要通过 try...catch 捕获处理
扫一扫
854
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
