본문 바로가기
부가정보

fetch API 요청 > .then((data) => {} 으로 바꿔쓰는 이유

by momomoo 2024. 4. 30.

 

const options = {
  method: 'GET',
  headers: {
    accept: 'application/json',
    Authorization: 'Bearer eyJhbGciOiJIUzI1NiJ9.eyJhdWQiOiJmNjExOWM3N2JlZWMzZjg1ZGFlNGEyZmVlZGQ4MmQ5NSIsInN1YiI6IjY2MjVjMGFjMmRkYTg5MDE2NGUxNDZkYSIsInNjb3BlcyI6WyJhcGlfcmVhZCJdLCJ2ZXJzaW9uIjoxfQ.mRUHyH8VV3djGDd__ILIb4QeEsbfRVwcDxbnUSmFbYg'
  }
};

fetch(url, options >> options이건 선택)
  .then(response => response.json())
  .then(response => console.log(response))
  .catch(err => console.error(err));

 

fetch API를 받아서 

.then(response => console.log(response)) 이걸

.then((data) => {}) 이렇게 바꾸는 이유는

 

 

 

.then(response => response.json()) 이렇게 JSON 형식으로 응답 해석 한걸 바로 

data라는 이름의 변수에 할당하고 해당 변수를 사용하기 위해서

이러면 가독성도 높이고 직접 접근이 가능하여 쉽게 조작할 수 있다.

 

 

.then(response => console.log(response)) 이런 형식으로 사용하려면

로깅된 데이터를 확인하고 해당 데이터의 구조를 파악한 후에 접근해야하기에 번거롭다.

 

 

 

그래서 .then((data) => {})으로 바꿔 사용하는게 일반적

 

 

'부가정보' 카테고리의 다른 글

로컬 스토리지  (0) 2024.04.30
JSON 형식  (0) 2024.04.30
TMDB  (0) 2024.04.23
Rest API 와 Restful API 차이점  (0) 2024.04.18
부트스트랩 cdn  (0) 2024.04.18