Callback vs Promise

민범기·2022년 5월 2일
0
post-custom-banner

자바스크립트에서 흔히 비동기 처리에 사용되는 두가지 방법이 있다.
바로 callback과 Promise 이다.

[Callback 이란?]

말그대로 나중에 다시 부를께 라는 말이다.
즉 함수가 끝나고 난 뒤에 실행되는 함수이다. 따라서 개발자가 함수의 동작 순서를 임의로 조절할수 있다. 비동기 처리라고 한다면 언제 정상적인 처리가 이루어 지는지 정확히 알아낼수 없다.특정코드가 마무리되기 전에 실행되지 않도록, 즉 비동기처리를 위한 방법이다.

콜백함수는..
1.다른 함수의 인자로써 사용되는 함수
2.이벤트로써 사용되는 함수

이렇게 정의 할 수 있겠다.

 const aaa=()=>{
   console.log("콜백");
 }

 const bbb=(aaa)=>{
   console.log("aaa야 어서와")
   return aaa()
 }

 bbb(aaa)

이런식으로 bbb 에서 선언된 aaa 함수를 인자로 받아서 bbb 함수에서 aaa 함수를 호출 후 리턴해주고 있다. 이렇게 함수를 실행하고 끝난 뒤에 마지막으로 나중에 실행되는 이러한 함수를 콜백 함수라고 한다.

[Promise]

프로미스는 말그대로 약속이다.
자바스크립트에서 비동기 처리에 사용되는 객체이다.
JS로 부터 약속을 받는것이다.
간단한 예제를 확인해보자.


const a = true
const promise = new Promise((resolve,reject)=>{
  if(a === true){
  resolve("성공")
  }else{
  reject("실패")
  }
})

promise.then((res)=>{
console.log(res)
}).catch((error)=>{
  console.log(error)
})

프로미스는 지속적인 비동기 처리 요청에서 콜백 지옥을 겪어야 했기에 나온 방식이다.
프로미스는 총 세가지 상태 pending,Fulfilled,reject 총 세가지 상태 값이 있으며,
fulfilled 상태 일때에는 .then 이후 콜백으로 성공한 값에 대한 반환값을 받을 수 있으며 reject 상태 일때는 catch 문에서 콜백으로 인해 해당 error를 반환 할 수 있다.

profile
프론트엔드 개발 지망생 민범기입니다^^
post-custom-banner

0개의 댓글