setTimeout 에 async, await 이용하기

• async/await

  콜백 함수를 사용하기 위한 방법

  Promise 방식을 사용하기 때문에 사용된 함수는 Promise를 리턴해야 함

• setTimeout()

  일정 시간이 지난 후에 콜백 함수를 호출함

• setTimeout 에 async/await 를 사용할 경우

  setTimeout은 Promise 객체를 return 하지 않음

  
  async const func async () => { 
      await foo(1, 2000) 
      await foo(2,3000)
      }
  const foo = (num, sec) => {
      setTimeout(()=> {
          console.log(num)}, sec)
          }
      

  위와 같은 경우 setTimeout 함수는 Promise 객체를 return 하지 않으므로 async/await 를 사용하더라도 foo 함수들은 동기적으로 실행되지 않음

  • 해결책

    setTimeout 함수가 Promise 객체를 return 하면 async/await 가 Promise 를 인식하므로 동기적으로 실행됨

    
       async const func async () => { 
        await foo(1, 2000) 
        await foo(2,3000)
        }
       const foo = (num, sec) => {
           return new Promise((resolve, reject) => {
             setTimeout(()=>   {
            console.log(num)}, sec);
            resolve("Promise 객체 return")
            }
           )}
            
      

    foo 함수는 Promise 를 return 하며 Promise 의 콜백은 setTimeout 와 resolve를 호출함

    await 들은 동기적으로 작업되며 순서대로 console 에 찍힘

• 요약

  async/await 를 사용하고 싶다면 Promise 를 필수적으로 return