Axios를 사용하여 클라이언트 측에서 데이터 타입 변환하기

Axios는 JavaScript에서 많이 사용되는 HTTP 클라이언트 라이브러리입니다. 데이터를 서버로 보내거나 서버로부터 받아오는데 사용됩니다. 클라이언트 측에서 서버로부터 받아온 데이터는 종종 원하는 데이터 타입으로 변환해야할 때가 있습니다. 이번 글에서는 Axios를 사용하여 클라이언트 측에서 데이터 타입을 변환하는 방법을 알아보도록 하겠습니다.

데이터 타입 변환

서버로부터 받아온 데이터의 기본 타입은 문자열입니다. 하지만 우리는 종종 숫자, 불리언, 날짜 등의 다른 데이터 타입으로 데이터를 다루고자 할 수 있습니다. 이럴 때 Axios는 우리에게 도움을 줍니다.

Axios의 get 또는 post 메소드를 사용하여 서버로부터 데이터를 받아올 때, 반환된 Promise는 response 객체를 포함합니다. response 객체의 data 속성은 서버로부터 받아온 데이터를 가지고 있습니다.

우리는 이 data 속성을 이용하여 데이터 타입 변환을 수행할 수 있습니다. 예를 들어, 서버로부터 받아온 데이터를 숫자로 변환하고 싶다면, 다음과 같이 코드를 작성할 수 있습니다.

import axios from 'axios';

axios.get('https://api.example.com/data')
  .then(response => {
    const data = response.data;
    const numericData = Number(data);
    console.log(numericData);
  })
  .catch(error => {
    console.error(error);
  });

위의 코드에서는 Axios의 get 메소드를 사용하여 서버로부터 데이터를 받아옵니다. then 메소드를 이용하여 Promise의 결과를 처리할 수 있습니다. response 객체의 data 속성을 Number 함수를 이용하여 숫자로 변환한 후, 이를 numericData 변수에 할당합니다.

예외 처리를 위해 catch 메소드를 사용하여 에러를 처리할 수도 있습니다.

요약

Axios는 클라이언트 측에서 서버로부터 받아온 데이터 타입 변환을 쉽게 할 수 있도록 도와줍니다. response 객체의 data 속성을 이용하여 받아온 데이터를 원하는 데이터 타입으로 변환할 수 있습니다.

더 자세한 내용은 Axios 공식 문서를 참고해주세요.

#axios #데이터타입변환