5초 뒤에 3을 반환하는 함수

라형선·2023년 7월 30일
0

친구가 5초 뒤에 3을 반환하는 함수를 짜보라고 문제를 냈다.

function after5secondsreturn3 () {
setTimeout(()=> {return 5} , 3000)
}

after5secondsreturn3 ()

코드를 짰지만 제대로 작동되지 않았다.

찾아보니 비동기로 코드를 짜야만 작동하는 것이였다.
아직 비동기 코드에 대한 이해도가 낮았기 때문에 어떻게 코드를 작성해야 되는지 찾아 볼 수 밖에 없었다.

공부를 하던 중 프로미스 객체 외부에서 프로미스 내의 연쇄적인 흐름에대한 예외처리가 어렵다는게 무슨말인지 이해하기 어려웠다.

프로미스(Promise)는 자바스크립트에서 비동기 작업을 다루는데 사용되는 객체입니다. 프로미스는 비동기 작업이 완료되거나 오류가 발생했을 때 해당 결과를 처리하는데 도움을 줍니다. 프로미스를 사용하면 비동기 코드를 보다 간결하고 가독성 있게 작성할 수 있습니다.

프로미스 내부에서는 연쇄적인 비동기 작업을 처리하는데 유용한 메소드인 then()과 catch()를 사용합니다. then() 메소드는 비동기 작업이 성공적으로 완료된 경우에 호출되며, catch() 메소드는 비동기 작업 중에 발생한 오류를 처리합니다.

예를 들어, 다음과 같이 프로미스를 사용하여 비동기 작업을 연속적으로 처리하는 경우를 생각해봅시다:

javascript
Copy code
function asyncTask1() {
  return new Promise((resolve, reject) => {
    // 비동기 작업을 수행하고 성공적으로 완료되면 resolve 호출
    // 오류가 발생하면 reject 호출
  });
}

function asyncTask2() {
  return new Promise((resolve, reject) => {
    // 비동기 작업을 수행하고 성공적으로 완료되면 resolve 호출
    // 오류가 발생하면 reject 호출
  });
}

asyncTask1()
  .then(() => {
    return asyncTask2();
  })
  .then(() => {
    console.log("모든 비동기 작업이 완료되었습니다.");
  })
  .catch((error) => {
    console.error("에러가 발생했습니다:", error);
  });

위 코드에서는 먼저 asyncTask1() 함수를 호출하고, 해당 작업이 성공적으로 완료되면 then() 메소드를 사용하여 다음 작업인 asyncTask2() 함수를 호출합니다. 마지막으로 then() 메소드로 연속된 작업들이 모두 완료되면 마지막 then() 블록에서 메시지를 출력합니다. 만약 어느 시점에서라도 오류가 발생하면 catch() 메소드로 오류를 처리합니다.

하지만, 이러한 연쇄적인 흐름에서 외부에서 예외 처리를 하려면 다소 복잡해질 수 있습니다. 예를 들어, asyncTask2()가 오류를 발생시킨다면 이를 asyncTask1()에서 처리하는 것은 쉽지 않을 수 있습니다. 이런 경우에는 보통 async/await을 사용하여 처리하면 더 깔끔한 코드를 작성할 수 있습니다.

예시 코드를 이용하여 async/await로 수정해보겠습니다:

javascript
Copy code
async function main() {
  try {
    await asyncTask1();
    await asyncTask2();
    console.log("모든 비동기 작업이 완료되었습니다.");
  } catch (error) {
    console.error("에러가 발생했습니다:", error);
  }
}

main();

async/await를 사용하면 연속적인 비동기 작업을 동기적인 코드처럼 보이게 작성할 수 있고, 오류 처리도 간편해집니다. 이렇게 async/await을 사용하면 프로미스 객체 외부에서도 연쇄적인 비동기 흐름에 대한 예외 처리를 보다 쉽게 할 수 있습니다.

profile
형선

0개의 댓글