[해결 방법] Parsing error: Unexpected reserved word 'await'

⚛️ 기본 환경: IDE: VS code, Language: React

 

 

발생 Error

React에서 다음 Source Code를 실행할 경우,

  function addMovieHandler(movie) {
    const response = await fetch('https://react-http-e9810-default-rtdb.firebaseio.com/movies.json', {
      method: 'POSt',
      body: JSON.stringify(movie),
      headers: {
        'Content-Type': 'application/json'
      }
    });
  }
 

🚨 다음과 같은 오류 발생

'await' expressions are only allowed within async functions and at the top levels of modules.

 

 

발생 원인

'await': 프로미스가 해결(resolve)될 때까지 기다리는 역할 = 데이터를 전달받을 때까지 기다리는 역할
🚨 비동기 함수(async function) 안에서만 사용되어야 하며, 함수 외부에서 사용하려면 비동기 함수를 호출해야함

 

 

해결 방법

비동기 함수 선언: async function

  async function addMovieHandler(movie) {
    const response = await fetch('https://react-http-e9810-default-rtdb.firebaseio.com/movies.json', {
      method: 'POSt',
      body: JSON.stringify(movie),
      headers: {
        'Content-Type': 'application/json'
      }
    });
  }