Alice In Toronto

10. JSON 개념 정리 와 활용방법 및 유용한 사이트 공유 본문

개발공부/Javascript

10. JSON 개념 정리 와 활용방법 및 유용한 사이트 공유

MyAlice 2021. 4. 27. 14:31
728x90

** 이 글은 유튜브 강의을 보고 공부하면서 스스로 콘솔로 작성하고, 따라치면서 Javascript 기초 공부를 하는 공간입니다.

 

www.youtube.com/watch?v=FN_D4Ihs3LE&list=PLv2d7VI9OotTVOL4QmPfvJWPJvkmv6h-2&index=10

//JSON 
//Javascript Object Notation

//1. Object to JSON
//stringfy(obj)

let json = JSON.stringify(true);
console.log(json); //true

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

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

};


json = JSON.stringify(rabbit); 
console.log(json); //"{'name':'tori','color':'white','size':null,'birthDate':'2021-04-26T17:42:17.324Z'}"

json = JSON.stringify(rabbit, ['name']);
console.log(json); //"{'name':'tori'}"

json = JSON.stringify(rabbit, ['name', 'color', 'size']);
console.log(json); //"{'name':'tori','color':'white','size':null}"

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

});

console.log(json); //"{'name':'ellie','color':'white','size':null,'birthDate':'2021-04-26T17:46:58.476Z'}"


//2. Json to Object
//parse(json)

json = JSON.stringify(rabbit);
const obj = JSON.parse(json);
console.log(obj); //
rabbit.jump(); //"${name} can jump!"


obj.jump(); //error!!!!!!!!!!!!!!!!!!!!!!! string 이기 때문이다. 


const obj = JSON.parse(json, (key,value) =>{
    console.log('key: ${key}, value: ${value}');
    return key === "birthDate" ? new Date(value) : value;

});

console.log(rabbit.birthDate.getDate()); //29
console.log(obj.birthDate.getDate()); //29
728x90
Comments