자바스크립트의 async await의 개념이 조금 헷갈립니다 선배님들 도와주세요..!

Question

자바스크립트의 async await은 내부적으로는 여전히 Promise를 사용해서 비동기를 처리하고, 단지 비동기적인 코드를 동기적으로 작성할 수 있게 해주어 코드가 간결해진다는 점을 인지하고 있습니다.하지만 Promise를 반환하는 함수 앞에 await를 붙이면, 해당 Promise의 상태가 바뀔 때까지 코드를 기다리게 되는데, 이는 결국 코드가 동기적으로 작동하는 것 아닌가요? async await은 콜백함수나 Promise와 더불어 비동기 처리를 위한 패턴이라고 알고 있는데 제가 대체 어떤 부분을 놓치고 있는지 궁금합니다..!

캐티 · Answer

번갈아 가면서 실행한다는 점을 놓치고 있는 것이지 않나요.비동기 함수라 하더라도 싱글 스레드 이므로 for-loop를 처리하게 되면 이 구문이 끝나기 전에 다른 처리가 안 이루어져요!

장독깨기 · Answer

await 는 async 함수 안에서만 유효합니다.자세한건 여기 한 번 읽어보세요.https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Statements/async_function

김을동 · Answer

async를 호출한 최상위 함수가 비동기이기(를흉내내는)때문에 내부가 순차적이거라도 결국 비동기인것인 개념

charlatan · Answer

자바스크립트는 기본적으로 단일 스레드로 실행되기 때문에, 예를 들어 굉장히 긴 루프를 실행하거나 처리 시간이 긴 함수가 실행되면 리턴될까지 기다리게 됩니다. 그러니까 그 시점에 프로그램은 중지 상태 보기에는 먹통이 된 것처럼 보일 수 있습니다. 이것을 동기식이라고 볼 수 있고요. 프라미스의 비동기는 다른 방식으로 프라미스를 리턴받을 때까지 기다리는 것처럼 보일 수 있지만 사실 그 리턴을 받는 것은 콜백 함수입니다. 그러니까 동기식처럼 기다리는 것이 아니라 바로 리턴하고 나중에 결과가 나오면 그걸 받는 콜백을 실행하는 것이죠.

allinux · Answer

다수개의 promise 들을 하나씩 await 하면 당연히 동기적으로 수행하는 것과 같습니다.아마도 다수개의 promise 들을 비동기적으로 처리하는 방법이 궁금할 것 같은데 Promise.all 을 학습해보세요.

심심하다능! · Answer

답변자분들이 질문자님의 진짜 질문 핵심을 이해 못하고 너무 이론적인 설명들만 한 것 같네요. 사실 저도 질문자님과 같은 시기가 있었기에 답변하자면,,, const a &#61; await func1(); const b &#61; func2(); 그리고 아래에 a, b 순서로 콘솔을 찍으면 b, a로 찍히고 이것이 곧 비동기처리라는 거죠. 그러나 만약 const c &#61; a &#43; b; 이런 형식이 있다면??? 이건 비동기가 아니라 동기방식처럼 보입니다. 왜냐하면 c는 a값이 할당될 때까지 기다려야 하기 때문이죠. 즉 async-await는 비동기가 맞습니다. 그러나 그와 관련된 것들은 대기를 했다가 결괏값을 받아 처리해야 하기 때문에 동기방식처럼 구현됩니다. 바로 이 부분때문에 동기처리 아닌가하고 헷갈려 하는 겁니다. 하지만 엄연히 말하면 c도 비동기로 구현된다고 이해하셔야 합니다.

자바스크립트의 async await의 개념이 조금 헷갈립니다 선배님들 도와주세요..!

6개의 답변

기술 목록