인프런 커뮤니티 질문&답변

강의 10분 경 비동기 방식에서 코드 실행 결과를 확인하기 위해 콜백함수를 사용해야 한다고 하셨는데, 아래와 같이 예시를 들어주신 콜백함수를 사용하는 코드와 그렇지 않는 코드의 다른 점이 무엇인지 궁금합니다. 두 코드의 결과는 똑같이 -1 -> 12 -> 7 순서로 콘솔창에 출력됩니다.

첫 번째는 예시를 들어주신 코드이고, 두 번째는 왜 콜백함수를 써서 결과를 봐야하지??라는 궁금증으로 수정해본 코드입니다.

function taskA(a, b, cb) {
  setTimeout(() => {
    const res = a + b;
    cb(res);
  }, 3000);
}

function taskB(a, b, cb) {
  setTimeout(() => {
    const res = a * b;
    cb(res);
  }, 2000);
}

function taskC(a, b, cb) {
  setTimeout(() => {
    const res = a - b;
    cb(res);
  }, 1000);
}

taskA(3, 4, (res) => {
  console.log(res);
});
taskB(3, 4, (res) => {
  console.log(res);
});
taskC(3, 4, (res) => {
  console.log(res);
});
taskA1(); // 이후 실행
console.log("코드 끝"); // taskA1 를 기다리지 않고
                      // 먼저 실행

function taskA(a, b) {
  setTimeout(() => {
    const res = a + b;
    console.log(res);
  }, 3000);
}

function taskB(a, b) {
  setTimeout(() => {
    const res = a * b;
    console.log(res);
  }, 2000);
}

function taskC(a, b) {
  setTimeout(() => {
    const res = a - b;
    console.log(res);
  }, 1000);
}

taskA(3, 4);
taskB(3, 4);
taskC(3, 4);