await은 비동기 함수인데 동기처럼 보이는 이유

개발을 하다 보니 문득 함수 안에서 await이 있는 코드가 비동기로 동작하면서도, 왜 그 다음 줄의 console.log()에서는 값을 바로 정상적으로 받아오는지 의문이 들었다. 😅

 const ask = async () => {
    try {
      const { granted } = await Location.requestForegroundPermissionsAsync();
      console.log(granted);

조사해보 결과, await은 비동기 작업이 맞지만 비동기 작업이 완료될 때까지 그 다음 줄의 코드를 실행하지 않도록 동작한다는 것을 알게 되었다. 다시 말해, await은 함수 안에서 순차적인 흐름을 유지하게 해준다. 이렇게 await 덕분에 함수 내부에서는 동기적인 흐름처럼 보이지만, 함수 자체는 비동기 함수이기 때문에 함수 외부에서는 다른 작업을 계속해서 수행할 수 있다.

결론적으로, async와 await이 적용된 함수는 내부적으로는 동기처럼 작동하지만, 외부적으로는 비동기로 작동한다는 사실을 깨달았다. 이제 await이 함수 내부와 외부에서 각각 어떤 역할을 하는지 더 명확하게 이해할 수 있을 것 같다! 분명 배웠던 부분인데 이렇게 문득문득 혼자 나한테 설명하려고 하면 막힐 때가 있다. 그때마다 열심히 되새김질하도록 하자.