1. 사용
await는 async function 내부에서만 사용할 수 있다. Promise를 기다리기 위해서 사용된다.
await가 들어가는 함수는 비동기여야 한다.
await(기다리고) 중에 다른 프로세스가 실행되고, 다 기다린 후 await가 들어간 함수가 실행된다.
2. 사용방법
[rv] = await expression;
expression :
Promise 혹은 기다릴 값을 나타낸다.
rv:
Promise에 의해 만족되는 값이 반환된다. Promise가 아닌 경우에는 그 값 자체가 반환된다.
3. 설명
await 문은 Promise가 fulfill되거나 reject 될 때까지 async 함수의 실행을 일시 정지하고, Promise가 fulfill되면 async 함수를 일시 정지한 부분부터 실행한다. 이때 await 문의 반환값은 Promise 에서 fulfill된 값이 된다.
ajax를 promise로.html
<!DOCTYPE html>
<html lang='ko'>
<head>
<meta charset='UTF-8'>
<title>Document</title>
</head>
<body>
<script>
//ajax 리턴을 promise로 바꾸어보기
const axios = {}; // axios라는 유명한 ajax 라이브러리가 있음(return Promise);
axios.get=function(p_set){
return new Promise((res,rej)=>{
let l_ajax = new XMLHttpRequest();
l_ajax.open("get",p_set.url,true);
l_ajax.onreadystatechange = function(){
if(l_ajax.readyState == 4 && l_ajax.status == 200){
res(l_ajax.responseText);
}
}
l_ajax.send()
})
}
// async, await 사람 머리는 비동기식으로 생각하기 어려움, 동기식에 익숙
async function f_check(){
let v_rslt = await axios.get({
url:"ES6.html"
});
console.log(v_rslt);
}
console.log(f_check()); //비동기함수 async함수의 return값은 promise임을 확인
console.log("이게먼저?"); //?
/*
axios.get({
url:"aaa.css"
}).then((p_rslt)=>{
alert(p_rslt);
});
*/
</script>
</body>
</html>출처 : https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Operators/await
와 수업내용
