비동기 기능
async / await는 ES8에 추가 된 두 개의 새로운 함수 키워드로, 동기 방식으로 작성된 코드를 비동기식으로 실행할 수 있습니다.
1. 비동기
async 키워드는 비동기 함수를 선언하는 데 사용됩니다.이 키워드는 함수 선언, 함수 표현식, 화살표 함수 및 메서드 앞에 사용할 수 있습니다.
async function f() {
return 1;
}
비동기 함수가 반환 값을 반환하면 (반환이 없으면 정의되지 않은 값이 반환 됨)이 값은 해결 된 Promise에 자동으로 래핑되고 결과는 값입니다.
async function f() {
return 1;
}
f().then(console.log); // 1
async는 함수가 Promise를 반환하고 Promise가 아닌 값을 래핑하도록합니다.
2. 기다려
await는 비동기 함수에서만 작동합니다.이 키워드는 비동기 함수 코드의 실행을 일시 중단하고 Promise가 해결 될 때까지 기다릴 수 있습니다.
async function f() {
let promise = new Promise((resolve, reject) => {
setTimeout(() => resolve("done!"), 1000)
});
let p = await promise; // 暂停
console.log(p); // 一秒后 "done!";
}
f();
프라 미스가 안정 되고 계속 실행될 때 p의 값을 얻을 때 까지 await 라인에서 함수가 일시 정지 됩니다. promise . 와 비교하면 프라 미스의 결과를 얻기위한 더 우아한 구문 일 뿐이며 또한 더 쉽습니다. 읽고 쓰기.
위의 함수는 다음과 같이 다시 작성할 수 있습니다.
let promise = new Promise((resolve,reject)=>{
setTimeout(()=> resolve("done!"),1000)
});
promise.then(console.log);
추신. Await는 일반 함수에서 사용할 수 없으며 M
<script>태그 와 같은 최상위 컨텍스트에서 사용할 수 없지만 비동기 함수는 즉시 정의하고 실행할 수 있습니다.
(async function f(){
console.log(await Promise.resolve(1));
})();
await 키워드를 완전히 이해하려면 단순히 값을 사용할 수있을 때까지 기다리는 것이 아님을 알아야합니다. JavaScript 런타임이 await 키워드를 만나면 실행이 일시 중단 된 위치를 기록합니다. await 오른쪽에있는 값을 사용할 수있는 경우 JavaScript 런타임은 작업을 메시지 대기열로 푸시하고이 작업은 비동기 함수의 실행을 재개합니다.
async function foo() {
console.log(2);
await null;
console.log(4);
}
console.log(1);
foo();
console.log(3);
// 1
// 2
// 3
// 4
await 다음에 즉시 사용 가능한 값이 있더라도 함수의 뒷부분은 비동기 적으로 평가됩니다.
요약하자면
비동기 함수는 JavaScript 함수에 계약을 적용한 결과입니다. 비동기 함수는 주 스레드를 차단하지 않고 실행을 일시 중단 할 수 있습니다.
함수 앞에 키워드 async는 두 가지 효과가 있습니다.
- 이 함수는 항상 약속을 반환합니다.
- 이 함수 내에서 await를 사용할 수 있습니다.
프라 미스 전에 키워드 await는 자바 스크립트 엔진이 프라 미스가 정착 될 때까지 기다린 후 다음을 수행합니다.
- 오류가 있으면 예외가 발생합니다. 마치 오류 발생이 호출 된 것과 같습니다.
- 그렇지 않으면 결과가 반환됩니다.