JS JSON 입문!

출처. https://www.youtube.com/watch?v=FN_D4Ihs3LE&t=222s 

예전에 프로젝트를 하면서 JSON을 썼었는데 JS에서 쓰니 깔끔한 것 같다.

C#이나 Python, c++은 복잡했던 기억이...

콜백 함수를 parameter로 줄 수 있어서 stringify 된 value값을

다시 obj로 살리는 reviver는 정말 이름값 하는 것 같다.

// JSON
// JavaScript Object Notation

// 1. Object to JSON
// stringfy(obj)
let json = JSON.stringify(true);
console.log(json);

json = JSON.stringify(['apple', 'banana']);
console.log(json);

const rabbit = {
    name: 'tori',
    color: 'white',
    size: null,
    birthDate: new Date(),
    jump: () => {
        console.log(`${name} can jump!`);
    },
};

// 함수는 JSON으로 변환되지 않는다.
// JS만의 datatype인 symbol도 변환되지 않는다.
json = JSON.stringify(rabbit);
console.log(json);

json = JSON.stringify(rabbit, ['name', 'color', 'size']);
console.log(json);

json = JSON.stringify(rabbit, (key, value) => {
    console.log(`key: ${key}, value: ${value}`);
    return key === 'name' ? 'CJM' : value;
});
console.log(json);

// 2. JSON to Object
// parse(json)
json = JSON.stringify(rabbit);
const obj = JSON.parse(json);
console.log(obj);
// 함수는 JSON으로 변환되지 않는다.
rabbit.jump();    // o
obj.jump();    // x

console.log(rabbit.birthDate.getDate());    // o
console.log(obj.birthDate);    // JSON으로 변환 될 때 stringify된 값이 출력된다.

// 그렇다면 obj에서도 birthDate를 object로 사용하고 싶다면?
const obj = JSON.parse(json, (key, value) => {
    console.log(`key: ${key}, value: ${value}`);
    return key === 'birthdate' ? new Date(value) : value;
});
console.log(obj.birthDate.getDate());    // o

기억할 것!!!

1. stringify(obj, replacer)

여기서 replacer는 내가 원하는 key값만 stringify 해 주는 것.

2. obj -> stringify -> parsed

obj에서 쓰이던 object(ex. new Date())는 parsed 된 곳에선 object로 사용할 수 없다.

왜? string값으로 넘어오기 때문

사용하려면

JSON.parse(obj, (key, value) => key === 'birthDate' ? new Date(value) : value;

정말 reviver라는 이름이 찰떡이다.