async & await

박찬효·2022년 9월 14일
0
post-custom-banner

async

  • function 앞에 async를 붙히면 해당 함수는 항상 프라미스를 반환합니다.

  • 프라미스가 아닌 값을 반환 하더라도 이행 상태의 프라미스로 값을 감싸 이행된 프라미스가 반환되도록 합니다.

  • return 값은 resolv() 값과 똑같습니다.


예시

async function f() {
	return 1 // 1
}
f().then(alert); // 1
async function f() {
	return Promise.resolve(1);
}

f().then(alert); // 1
    

위에 예시와 같이 async가 붙은 함수는 반드시 프라미스를 반환하고, 프라미스가 아닌 것은 프라미스로 감싸 반환합니다. 또 다른 키워드 await은 async 함수 내에서만 동작합니다. 세트라고 보시면 됩니다.

await

  • await는 말 그대로 프라미스가 처리될 때까지 함수 실행을 기다리게 만듭니다.

  • 프라미스 처리되면 그결과와 함께 실행이 재개됩니다.

  • 프라미스가 처리되길 기다리는 동안 다른일을 할 수 있기 때문에 사용하기 좋습니다.

  • promise.then보다 가독성이 좋고 쓰기가 편합니다.

await 기본 문법

기본 문법

// await는 async 함수 안에서만 작동이 가능하다
 const value = await promise;

알아야 할 문법

  • async 함수가 아닌데 await을 사용한다면,
function n(){
	let promise = promise.resolve(1);
    let result = await promise // Syntax error
}

function 앞에 async를 붙이지 않으면 이런 에러가 발생 할 수 있습니다.

async & await 쓰는 이유?

  • async는 에러 위치를 찾기 쉽습니다.

  • async 코드는 가독성이 좋습니다.

  • async는 에러 핸들링에 유리합니다.

  • async/await를 사용하면 promise.then/catch가 거의 필요 없다.

profile
개발자가 되기 위한 1인
post-custom-banner

0개의 댓글