01. 동기적 작업 흐름과 비동기적 작업 흐름

---

선행 작업이 끝날 때까지 기다렸다가 후행 작업이 진행되는 작업 흐름을 동기적 흐름 또는 동기적 처리라 한다.
실행 자체가 뒤에 되는 것이아니라 작업은 같이 진행하지만 앞의 작업이 끝나는지를 기다림

• 동기적 작업 흐름을 따르지 않는 흐름을 비동기적 작업 흐름 또는 비동기 처리라 한다.

console.log("a")
setTimeout(() => {
  console.log("b")
},1000)
console.log("c")

// a, c, b 순서로 출력된다.
// 1000 -> 0으로 바꾸더라도 출력되는 순서는 바뀌지 않는다. = setTimeout은 1000이든 0이든 상관없이 자신의 작업이 처리되기 전에 다음으로 넘긴다.

동기는 완료를 기다리고 비동기는 완료를 기다리지 않는다.

02. 어떤 코드들이 비동기적으로 작동하는가?

---

• JavaScript 스펙 또는 사용하고자 하는 라이브러리의 문서를 참고하여 직접 확인하여야 한다.
• 일반적으로 통신을 해야 하는 코드들 또는 실행이 오래 걸릴 것(ex, Nodejs의 암호화 라이브러리, 파일시스템)으로 예상되는 코드들이 비동기적으로 작동하도록 만들어져 있다.

03. Promise

---

• Promise는 약속이다. "비동기적으로 작업을 처리해 주겠다는 약속"이다.
• Promise 스펙을 활용한 비동기 작업들은 Promise(약속)을 돌려준다(리턴한다)

01.약속(Promise)의 세 가지 상태

1. pending -> 약속을 막 한 상태(약속 생성)
2. fulfilled -> 약속을 성공적으로 잘 수행한 상태(약속 지킴)
3. rejected -> 약속을 성공적으로 수행하지 못 한 상태(약속 못 지킴)

   pending 이후 === 'success' ? fulfilled : rejected

02. 약속을 만드는 법

1. new Promise()
   • resolve = resolve(data) => 완료된 상태가되면? ㄴㄴ 완료가 되면!
   • reject = rehect('실패') => 실패 하면!
2. async function () {}
   • 즉 async함수는 항상 약속(Promise)를 리턴한다.
3. 약속을 then으로 이어나갈 경우

• 약속의 내용이 동기적인 내용으로만 구성이 된다면 바로 fulfilled가 된다.

03. 약속의 내용이 성공 또는 실패

1. then사용(ES6에서 추가)

   fetch(url)
   	.then
       .then
       
   // 가시적인 흐름을 보기 너무 힘들다. 그래서 등장한 것이 await

2. await사용(ES7에서 추가) - 원래는 비동기적인 작업이지만 기다렸다가 가겠습니다(약속을 잘 기다릴게요)

04. Await

await is only valid in async functions and the top level bodies of modules
type = module 선언을 해주기 싫어! -> async function으로 코드를 감싼다 또는 body에서 then을 쓴다.

• await 키워드는 async function 또는 module의 top level body에서만 사용할 수 있다.