then/catch 메소드와 async await의 문법차이는?

Choi_free·2024년 1월 27일

GPT4.0

목록 보기
2/2
post-thumbnail

then/catch 메소드와 async/await는 둘 다 JavaScript에서 비동기 작업을 처리하는 방법입니다. 그러나 이들은 사용법과 문법적인 측면에서 몇 가지 중요한 차이점을 가지고 있습니다.

then/catch 메소드
Promise 기반: then과 catch는 Promise 객체의 메소드입니다. 이들은 Promise의 결과에 따라 실행될 콜백 함수를 설정합니다.

체이닝(Chaining): then과 catch는 체인 형태로 연결될 수 있어, 여러 비동기 작업을 순차적으로 실행하고 각 단계에서 오류를 잡을 수 있습니다.

구문: 비동기 작업이 완료될 때 실행할 콜백 함수를 인자로 전달합니다. then은 성공 시, catch는 오류 발생 시 실행됩니다.

예시:

javascript
Copy code
doSomethingAsync()
  .then(result => doSomethingElseAsync(result))
  .catch(error => console.error(error));

async/await 문법
async 함수: async/await는 async로 정의된 함수 내에서만 사용됩니다. 이 함수는 항상 Promise를 반환합니다.

동기적 코드 스타일: await 키워드는 Promise가 해결될 때까지 함수 실행을 일시 중지시킵니다. 이로 인해 코드가 동기적으로 보이며, 이해하고 작성하기 쉬워집니다.

오류 처리: 오류 처리는 try/catch 블록을 사용하여 이루어집니다. try 블록 내에서 await을 사용하여 비동기 작업을 수행하고, catch 블록에서 오류를 잡습니다.

예시:

async function asyncFunction() {
  try {
    const result = await doSomethingAsync();
    const newResult = await doSomethingElseAsync(result);
  } catch (error) {
    console.error(error);
  }
}

주요 차이점
가독성: async/await은 코드를 동기적으로 작성할 수 있게 해주어, 특히 복잡한 비동기 로직에서 가독성이 높습니다.
오류 처리: then/catch는 각 Promise마다 오류 처리를 해야 하지만, async/await에서는 try/catch 블록을 통해 여러 비동기 작업의 오류를 한 곳에서 처리할 수 있습니다.
표현력: async/await을 사용하면 더 직관적이고 선언적인 방식으로 비동기 로직을 표현할 수 있습니다.
두 방법 모두 각기 다른 상황과 개인적인 선호에 따라 유용하게 사용될 수 있습니다.

profile
울지말고 해결하자,

0개의 댓글