ES6中 async 函数、await表达式

目录

一、async函数

1.定义

2.演示

二、await表达式

1.定义

2.注意

3.演示

三、async await ajax使用

---

一、async函数

1.定义

async 是一个修饰符，async 定义的函数会默认的返回一个Promise对象resolve的值，因此对async函数可以直接进行then操作,返回的值即为then方法的传入函数。

2.演示

async function demo(){
// 1:当返回值不是promise对象 当调用函数的时候就是已成功的值。
// return "succ";
// 2:当返回的是promise对象 那么函数(promise对象)的结果与返回的promise状态一致。
return  new Promise((resolve,reject)=>{   
			let flag = true;
				if(flag){
				resolve("succ");
			}else{
				reject("error");
				}
				})
			}
const MyPromise = demo();
MyPromise.then((resolve)=>{
	console.log(resolve);
},(reject)=>{
	console.log(reject);
})

二、await表达式

1.定义

它也是一个修饰符，await 关键字 只能放在 async 函数内部， await关键字的作用 就是获取 Promise中返回的内容， 获取的是Promise函数中resolve或者reject的值。

2.注意

1：await必须放在async函数中。

2：await右侧的表达式一般为promise对象。

3：await可以返回的是右侧promise成功的值。

4：await右侧的promise如果失败了，就会抛出异常，需要通过try…catch捕获处理。

3.演示

(1) 成功

// 1:await需要写在async函数的内部。
// 2:await 修饰的Promise 返回的值就是resolve的值。
// 3:后面的代码需要等待 await后的结果。
async function demo(){
const a = await "a";
const b = await new Promise((resolve,reject)=>{
	setTimeout(()=>{
		console.log("定时器执行了....");
	resolve("b");
		},3000);
	});
const c =  await "c";
console.log(a,b,c);
			}
			demo();

(2) 失败：失败的代码 await 错误的代码 需要用try catch捕获

async  function demo(){
	try{
	const a = await new Promise((relsolve,reject)=>{
		reject("数据不存在");	
})
	}catch(error){
		console.log(error);
				}
			}
demo();

三、async await ajax使用

首先要创建对象，用get的方法请求后面传入的地址，再发送请求，通过判断出输出有无数据。

function sendajax(url){
	return new Promise((resolve,reject)=>{				
		  const http =  new XMLHttpRequest();//创建对象
		  http.open("GET",url);//用get方法请求地址
		  http.send();//发送请求				
		  http.onreadystatechange = function(){					  
			  if(http.readyState==4){							  
				  if(http.status==200){
					  resolve(JSON.parse(http.response));
				  }							  
			  }						  
		  }  										  
	})				
}			
async function demo(){				
	const res = await sendajax("http://127.0.0.1:8848/web2209/ES6/test.json");
	if(res.code==200){
		console.log("有数据");
	}else{
		console.log("无数据");
	}		
}
demo();