자바스크립트 제이슨 변환

Feb 26, 2024
자바스크립트 제이슨 변환
 
💡
JavaScript Object Notation (JSON)은 Javascript 객체 문법으로 구조화된 데이터를 표현하기 위한 문자 기반의 표준 포맷으로, 웹 어플리케이션에서 데이터를 전송할 때 공통 언어로 사용된다.
 
 
 
 
notion image
 
 
그림과 같은 자바스크립트 오브젝트 user가 있다. 자바스크립트의 오브젝트는 다른 프로그램 언어가 이해할 수 없기 때문에 통신이 불가능하다. 따라서 통신이 가능하게 하려면 서로 공통 언어로 변환한 후 데이터가 전송되어야 한다. 반대로 다른 언어에서 자바스크립트로 데이터를 받을 때도 제이슨 문자열로 받은 후 자바스크립트 오브젝트로 변환되어야 한다.
 
그림의 user 오브젝트를 JSON 타입으로 변환해본다.
 

1. JS 오브젝트 → JSON 타입

 
<script> let user = { id: 1, username: "ssar", password: "1234", hobby: ["축구", "농구"] }; // js object -> json String . 매우 중요. 제이슨은 문자열 let requestBody = JSON.stringify(user); console.log(requestBody); </script>
 
 
notion image
 
stringify()함수를 사용해 JSON 타입으로 변환되었다.
 

2. JSON 타입 → JS 오브젝트

 
<script> let user = { id: 1, username: "ssar", password: "1234", hobby: ["축구", "농구"] }; // js object -> json String let requestBody = JSON.stringify(user); console.log(requestBody); // json String -> js object let responseBody = JSON.parse(requestBody); console.log(responseBody); </script>
notion image
 
user 오브젝트를 JSON 으로 변환해 requestBody 변수에 담은 후, 다시 responseBody 에 전달한다. parse() 함수를 통해 JSON 문자열을 자바스크립트 오브젝트로 변환한다.
 
Share article

{CODE-RYU};