[자바스크립트] Callback/Promise & async/await

강지훈·2022년 12월 21일
0

자바스크립트

목록 보기
8/12



Callback

콜백함수란?
다른 함수가 실행을 끝낸 뒤 실행되는 callback되는 함수 를 말한다.
그리고, 함수를 만들때, parameter 를 함수로 받아서 쓸 수 있는데
그 함수를 콜백이라고 부른다.

동기적 & 비동기적 방식의 차이?

동기적 방식 : 현재 실행 중인 코드가 완료된 후 다음 코드를 실행
예시 : async/await를 이용하여 함수에 적용!
비동기적 방식 : 현재 실행중인 코드의 완료 여부와 무관하게
즉시 다음 코드로 넘어가서 실행
예시 : setTimeout


Promise

프로미스는 주로 서버에서 데이터를 받아온 값을 보여줄 때 사용한다.

Promise의 형식은 아래와 같다.

// promise
const promise = new Promise((resolve, reject) => {

if (/* 비동기 작업 수행 성공 */) {
  resolve('success');
}
else { /* 비동기 작업 수행 실패 */
  reject('failure');
}
});

then & catch

then

두 개의 콜백 함수를 인자로 전달받는다.
첫번째 콜백함수는 성공할 때 호출되며, 두번째 콜백함수는 실패할 때 호출된다.
then메소드는 Promise를 반환한다.

catch

예외가 발생할 때 호출된다.
catch메소드는 Promise를 반환한다.


Async & Await

Async
function 키워드 앞에 async 키워드 위치
function 앞에 async를 붙이면 해당 함수는 항상 프라미스를 반환
프라미스가 아닌 값을 반환하더라도 이행 상태의 프라미스(resolved promise)로 값을 감싸 이행된 프라미스가 반환되도록함
async가 붙은 함수는 반드시 프라미스를 반환하고, 프라미스가 아닌 것은 프라미스로 감싸 반환함

Await
async 함수 안에서만 동작
자바스크립트는 await 키워드를 만나면
프라미스가 처리(settled)될 때까지 기다림. 결과는 그 이후 반환

profile
우당탕탕 개발자

0개의 댓글