[JS] 🖇JSON.stringify / 🖇JSON. parse

TATA·2023년 2월 13일
0

JavaScript

목록 보기
22/23

▷ JSON이란?

JavaScript Object Notation

JSON은 데이터 교환을 위해 만들어진 객체 형태의 포맷을 말한다.

const message = {
  sender: "TATA",
  receiver: "CHIMMY",
  message: "CHIMMY야 오늘 점심 뭐 먹을까?",
  createdAt: "2022-02-14 10:10:10"
}
// 네트워크를 통해 이 객체 내용을 다른 프로그램에게 전송하고 싶다면,
// JSON.stringify와 JSON.parse를 사용하면 된다.
// JSON.stringify => 객체를 JSON으로 변환한다.
// JSON.parse => JSON을 객체로 변환한다.
// ❗️참고) 전송 가능 조건 - 수신자와 발신자가 같은 프로그램을 사용, 또는 문자열처럼 범용적으로 읽을 수 있어야 함

🖇JSON.stringify

객체를 JSON으로 변환하는 메서드이다.
(JSON으로 변환된 객체의 타입은 문자열이다.)

❗️참고) stringify하는 이 과정을 직렬화(serialize)한다고 한다.

// message객체를 JSON으로 변환하는 메서드 JSON.stringify
let transferableMessage = JSON.stringify(message)

console.log(transferableMessage) 
// `{"sender":"TATA","receiver":"CHIMMY","message":"CHIMMY야 오늘 점심 뭐 먹을까?","createdAt":"2022-02-14 10:10:10"}`

console.log(typeof(transferableMessage))
// `string`

🖇JSON. parse

JSON(문자열)을 다시 객체 형태로 변환시켜 준다.

❗️참고) JSON.parse하는 과정을 역직렬화(deserialize)한다고 한다.

// 직렬화된 JSON에 메서드 JSON.parse를 적용하면,
// 다시 객체의 형태로 변환할 수 있다.
let packet = `{"sender":"TATA","receiver":"CHIMMY","message":"CHIMMY야 오늘 점심 뭐 먹을까?","createdAt":"2022-02-14 10:10:10"}`
let obj = JSON.parse(packet)

console.log(obj)
/*
 * {
 * sender: "TATA",
 * receiver: "CHIMMY",
 * message: "CHIMMY야 오늘 점심 뭐 먹을까?",
 * createdAt: "2022-02-14 10:10:10"
 * }
 */

 console.log(typeof(obj))
 // `object`

직렬화와 역직렬화 모식도


🔥JSON vs JS객체

비슷해 보이지만 다르게 생긴 JSON과 자바스크립트 객체

자바스크립트 객체JSON
키는 따옴표 없이 쓸 수 있음 { key : "property" }반드시 쌍따옴표를 붙여야 함 '{"key":"property"}'
문자열 값작은따옴표도 사용 가능 { "key" : 'property' }반드시 큰따옴표로 감싸야 함 '{"key":"property"}'
키와 값 사이 공백사용 가능 {"key" : 'property'}사용 불가능 '{"key":"property"}'
키-값 쌍 사이 공백사용 가능 { "key":'property', num:1 }사용 불가능 '{"key":"property","num":1}'



👉 JSON 공식 문서

profile
🌿 https://www.tatahyeonv.com

0개의 댓글

Powered by GraphCDN, the GraphQL CDN