[JavaScript]자바스크립트와 JSON - stringify, parse, toJSON

[ JSON 이란? ]

 

 JSON(JavaScript Object Notation)은 자바스크립트의 데이터를 표현하는 텍스트 기반의 데이터 포맷입니다. 

 

 .json 파일에서 데이터를 작성할 때는 자바스크립트의 객체 표기법과 유사합니다. 이때 데이터형은 undefined를 제외한 string, number, boolean, null, 객체(object), 배열(array)이 가능합니다. 

 

 이때 string은 큰 따옴표(" ")만을 사용하여 표기합니다. 

 

 

 

 

 

[ 자바스크립트에서의 JSON ]

 

 json 파일은 하나의 문자 데이터로 단순하게 하나의 메모리에 저장되어 있는 큰 덩어리라고 생각할 수 있습니다. 

 

 자바스크립트에서 이 json 파일은 자동으로 문자 데이터가 아닌 객체 데이터처럼 사용됩니다. 

 

//main.js

import myData from './myData.json'

console.log(myData)

 

 

 

 

 

[ 자바스크립트에서 JSON 데이터 처리하기 ]

 

 자바스크립트는 JSON 데이터를 처리하기 위해 다음과 같은 메소드를 제공합니다. 

 

1. JSON.stringify() 

 

 JSON.stringify() 메소드는 인수로 전달받는 자바스크립트 객체(object)를 json 형태로 문자 데이터화 시켜 그 문자 데이터를 반환합니다. 

 

기본형

JSON.stringify(객체)

 

const user = {
  name: 'neo',
  age: 20,
  major: 'computer science'
}

console.log('Object 형', user)

const str = JSON.stringify(user)

console.log('JSON 형', str)

 

 

 

2. JSON.parse() 

 

 JSON.parse() 메소드는 stringify와 반대로 json 형태의 데이터를 분석하여 자바스크립트에서 활용할 수 있는 객체 데이터로 변경해줍니다. 

 

기본형

JSON.parse(json데이터)

const user = {
  name: 'neo',
  age: 20,
  major: 'computer science'
}

const str = JSON.stringify(user)

console.log('JSON 형', str)

const obj = JSON.parse(str)

console.log('Object 형', obj)

 

 

 

3. toJSON()

 

 toJSON() 메소드는 자바스크립트의 Date 객체의 데이터를 JSON 형식의 문자열로 변환하여 반환합니다. 

 

 이때 반환되는 문자열은 접미사 Z로 식별되는 UTC 표준 시간대의 날짜를 YYYY-MM-DDTHH:mm:ss.sssZ 형식으로 표현한 문자열입니다. 

 

const date = new Date()

const str = date.toJSON()

console.log(str)