fetch

fetch('https://jsonplaceholder.typicode.com/todos/1')

.then((response)=>{

  return response.json();

})

.then((data)=>{

  console.log(data);

})

.catch((err)=>{

  throw err;

});

자바스크립트 자체에서 지원해주는 메소드다. Promise를 반환하기 때문에, then을 쓸 수 있다.

 

저 주소로 데이터를 요청하고, 응답이 왔으면 그걸 json으로 바꿔준다. 그 다음, 데이터로 제대로 들어온거라면 console.log로 데이터를 출력하고, 아니면 에러를 catch한다.

 

그리고, 만약 

fetch('https://jsonplaceholder.typicode.com/todos/1')

.then((response)=>{

  if(!response.ok){

    throw new Error('Network response was not ok');

  }

  return response.json();

})

.then((data)=>{

  console.log(data);

})

.catch((err)=>{

  throw err;

});

이렇게 미리 response가 ok응답인지 (200~299) 확인하고 에러를 던지면 

저 .then((data))를 무시하고 바로 catch로 갈 수 있다.

 

 

Error가 return까지 가는거 무시하고 거기서 바로 에러 뿜는거다.

그걸 잡는 역할이 catch

 

여튼 fetch로 데이터 요청(fetch는 비동기 함수임.),

데이터가 왔으면 응답을 검사,

제대로 200~299의 응답이면 json으로 바꿈.

그때 json으로 바뀌어진 데이터를 

활용함. 이 경우엔 그냥 출력.