JavaScript

AJAX

async

Promise

await
async 함수 안에서나 promise 객체 앞에서, promise가 처리될 때까지 기다렸다가 이후에 실행된다.

let value = await promise;

• promise가 처리되기를 기다리는 동안, 다른 일들을 수행할 수 있기 때문에 리소스가 낭비되지 않는다는 장점이 있다.
• promise에 all을 붙여 모든 promise가 처리되길 기다리도록 할 수 있다.
• result 값을 반환해 주는 역할을 한다.

promise가 이행되지 않으면, throw문처럼 error를 던져준다.

error에 try-catch문을 사용할 수 있다.

fetch
페이지 새로 고침 없이 정보를 받아올 때 사용한다.
fetch()를 호출하면 네트워크 요청을 보내고 promise가 반환된다.
=> await 또는 .then()을 사용하여 데이터를 받은 후의 동작을 처리한다.

let promise = fetch(url, [options])

• options
  => options에 인수를 넘기지 않으면, GET 요청으로 실행된다.

response의 메소드를 활용하여 응답받은 본문을 처리할 수 있다.
=> 본문을 읽을 때는 하나의 메소드만 사용할 수 있다.

.json() 메소드를 이용하여 받은 값을 불러올 수 있다.

• 응답 헤더
  => response.headers에 map과 유사한 형태로 저장된다.
• 요청 헤더
  => headers options을 사용해 요청 헤더를 설정할 수 있다.
• POST 요청
  => GET 이외의 요청에는 추가 options를 사용해야 한다.

  body는 문자열 | FormData | Blob | BufferSource | URLSearchParams 중 하나여야 한다.