async 与await 解决请求回调地狱(多层请求嵌套)

async 与await 解决请求回调地狱(多层请求嵌套)

1.async(异步) 与 await(同步) 方法 解决请求回调地狱 是通过promise来实现的，所以使用这两个方法进行测试也是要模拟返回一个promise对象===手动返回。

*没有返回promise对象将无法实现异步同步
(错误写法)

function test1(){
	setTimeout(()=>{
		return 50;
	},5000)      //这里使用setTimeout来模拟 请求等待(请求1未完成)
}
 async function test2(){
	let  num= await test1();
	console.log(num);
}
test2();
//这里打印出的是undefined  因为test1 方法并没有满足要求(返回一个promise对象) 所以没有实现await(同步)的效果。而是不等test1执行直接就console.log()了

(正确写法)

function test1(){
	return new Promise((resolve,reject)=>{   //成功信息由 resolve 抛出      错误信息由 reject抛出
			setTimeout(()=>{
				return 50;
		},5000)      //这里使用setTimeout来模拟 请求等待(请求1未完成)
	})
}
 async function test2(){
	let  num= await test1();
	console.log(num);
}
test2();
//打印出50；     这里执行时，遇到await 就一直等待 test1执行完成，才继续执行。

注意：1. await 只能在async 函数内使用
2. 如果想获取async 函数内 return 的值 只能使用 方法().then(res=>{/res就是return 的值/})

多个依赖请求时的使用方法：

function getMessage(){
	return  axios.get('/xxx')
}

function getInfo(info){
	return axios.post('/xxxxx',{ info})
}

//触发请求的方法
async function click(){
	let status = await getMessage();   //因为axios  默认会返回一个promise对象  所以 status为此时getMessage()方法请求返回的	promise对象
	if(status.code===200){
		let status2=await  getInfo(status.info);
		if(status2.code===200){
			//获取getInfo中的最终数据
			  let arr=status2.data;
		}
	}
}

//getMessage方法请求返回的数据
{
	code:200 ,      //失败   204
	info:'完成'
}
//getInfo 方法请求返回的数据
{
	code:200,
	data:[]
}

可以在 click方法内加上 try catch

async function click(){
	try{
	let status = await getMessage();   //因为axios  默认会返回一个promise对象  所以 status为此时getMessage()方法请求返回的	promise对象
	if(status.code===200){
		let status2=await  getInfo(status.info);
		if(status2.code===200){
			//获取getInfo中的最终数据
			  let arr=status2.data;
		}
	}
	}catch(err){
		console.log(err);
	}
}