[코드스테이츠/26DAY] S2U3 - [JS/Node] 비동기 Fetch()

🌊 TIL : 2023년 3월 21일  

 

오늘 배운 것

 

 

fetch() : https://developer.mozilla.org/ko/docs/Web/API/Fetch_API

: fetch API는 특정 URL로부터 정보를 받아오는 역할을 한다. 이 과정이 비동기로 이루어지기 때문에 경우에 따라 다소 시간이 걸릴 수 있다. 시간이 소요되는 작업을 요구할 경우 blocking이 발생하면 안되므로, 특정 DOM에 정보가 표시될 때 까지 로딩 창을 대신 띄우는 경우도 있다.

let url =
  "https://koreanjson.com/posts/1";
fetch(url)
  .then((response) => response.json())
  .then((json) => console.log(json))
  .catch((error) => console.log(error));

fetch 반환값 : Promise 객체 

Headers : 리퀘스트와 리스폰스 객체에 대한 헤더, 헤더정보에 보내는 쿼리나 통신 결과의 행동에 대한 선택이 가능하다.

Request : 리소스에 대한 리퀘스트의 객체

Response : 리퀘스트에 대한 리스폰스 객체

Body : Response와 Request 본체에 관련된 메소드들이 정의되어 있다. 

 

Response : https://developer.mozilla.org/en-US/docs/Web/API/Response

Response.body : 객체를 읽을 수 있게 해준다.

Response.headers : 헤더에 대한 정보가 들어있다.

Response.ok : 성공 여부에 대해 알려준다. 

 

 

어려웠던 부분

: 영어.... 영어를 잘 해야한다.. 

헷갈리는 부분을 MDN으로 찾아봤을 때 영어 페이지엔 더 자세히 나와 있었다. 영어 공부의 필요성 매우 느끼는 중..

 

 

더 공부할 것

: promise all, async