8월 31일(화) Callback

Callback

A way to handle async

const print = (string) => {
  setTimeout(
    () => {
      console.log(string)
    },
    Math.floor(Math.random() * 100) + 1
  )
}
const printAll = () => {
  print("A")
  print("B")
  print("C")
}
PrintAll() // What do you expect?

결과 값으로는 A, B, C가 랜덤으로 출력된다.

printAll의 출력값을 제어하기 위해서 callbak 함수를 사용한다.

printAll의 A, B, C를 제어하기 위한 callback 예

const print = (string, callback) => {
  setTimeout(
    () => {
      console.log(string)
      callback()
    },
    Math.floor(Math.random() * 100) + 1
  )
}
const printAll = () => {
  print("A", () => {
    print("B", () => {
      print("C", () => { })
    })
  })
}
PrintAll() // What do you expect?

Callback error handling Design

const something = callback => {
  watingUntillSomething()
  if(isSometingGood) {
    callback(null, something)
  }
  if(isSomthingBad) {
    callback(something, null)
  }
}
//usage
something((err, data) => {
  if(err) {
    console.log('ERR!');
    return;
  }
  return data;
})

callback HELL

콜백이 순차적으로 이루어져서 좋긴하지만 가독성이 매우 떨어지며, 코드 관리가 어려워진다.

callback함수는 매우 유용하지만 callback hell에 빠질수 있으며 그걸 보완하기 위하여 promise를 사용한다.

github TIL(Callback 정리)