JSON : 객체를 네트워크를 통해 전송하거나 저장소에 저장하려면 문자열로 변환해야하는데 JSON은 값이나 객체를 나타내주는 범용포맷이다.
객체뿐만아니라 원시값에도 적용이 가능하다.
객체 프로퍼티 중 매서드, 키가 심볼인 경우, 값이 undefined인 경우, 순환참조가 있는 경우 stringify 되지 않는다.
JSON.stringify(obj, replacer(key, value), space )
2번째 인자는 함수를 통해 객체의 원하는 부분만 인코딩 가능하며, 또는 함수 대신
인코딩 할 객체 프로퍼티 키를 배열로 나타낼 수도 있다.
3번째 인자 space는 인코딩된 객체의 가독성을 위해 들여쓰기 공백을 지정할 수 있다.
let room = {
number: 23,
};
let meetUp = {
title: "Conference",
participants: [{name: "John"}, {name: "Alice"}],
place: room
};
room.occupiedBy = meetUp;
room객체의 occupiedBy와 meetUp객체의 place는 서로를 순환참조하고 있다.
따라서 meetUp객체를 인코딩하길 원한다면 place가 참조한 room의 ocuupiedBy
만 빼고 인코딩하면 된다.
두번째 인자를 배열로 인코딩하는 방법
JSON.stringify(meetUp,['title', 'participants', 'name', 'place', 'number']);
두번째 인자에 배열에 인코딩할 프로퍼티만 골라서 담아뒀다. 특이한 점은
participants는 중첩 객체일지라도 추가 조치 없이 name 키 값을 그냥 배열에
적어주면 된다.
두번째 인자를 함수로 인코딩하는 방법
JSON.stringify(meetUp,function(key, value) {
return key == 'occupiedBy' ? undefined : value
})
원치않는 객체만 undefined를 반환하고 나머지는 value 그대로 반환하면된다.
{"title":"Conference","participants":[{"name":"John"},{"name":"Alice"}],"place":{"number":23}}
둘다 JSON 문자열로 똑같이 인코딩 된다.
3번째 인자 space값에 2를 넣어보면?
JSON.stringify(meetUp,function(key, value) {
return key == 'occupiedBy' ? undefined : value
}, 2)
{
"title": "Conference",
"participants": [
{
"name": "John"
},
{
"name": "Alice"
}
],
"place": {
"number": 23
}
}
들여쓰기 공백을 주어 읽기 편하게 인코딩 할 수 있다.
인코딩된 객체를 다시 디코딩하는 매서드.
JSON.parse(str, reviver(key,value)) : 인코딩한 객체 프로퍼티의
value 값이 new Date()같은 객체였을 경우 다시 parse할 때 객체라 인식하지 못하고
문자열로 반환하는데 reviver를 통해 value를 객체로 반환할 수 있게 해준다.
let schedule = `{
"meetups": [
{"title":"Conference","date":"2017-11-30T12:00:00.000Z"},
{"title":"Birthday","date":"2017-04-18T12:00:00.000Z"}
]
}`;
위 객체는 JSON으로 인코딩된 객체이다. date 프로퍼티의 value 값은 문자열처럼
보이지만 new Date()값을 인코딩 했던 value이다.
let time = JSON.parse(schedule, function(key,value) {
if(key === 'date') return new Date(value);
return value
})
위 함수를 사용하여 다시 객체로 변환하여 준다.
console.log(time.meetups[0].date.getTime());
getTime()같은 매서드를 사용할 수 있게 된다.