동캄의 코딩도장

JS [JSON] 본문

front/HTML&CSS&JS

JS [JSON]

동 캄 2022. 1. 25. 09:59

서버와 통신
- fetch() API
- XMLhttprequest
- JSON

XML을 사용하지 않는 이유
-  JSON이 나와서

Object
- Object로 이루어져있음

JSON 공부방법
- 직렬화 & 비직렬화

 

// JSON
// JavaScript Object Notation

// 1. Object to JSON
// stringify(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=JSON.stringify(rabbit);
console.log(json);

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

json=JSON.stringify(rabbit,(key,value)=>{
    console.log(`Key: ${key}, value: ${value}`);
    return key === 'name' ? 'ellie':value;
})
console.log(json);
//  2. JSON to obejct
// parse(json)
json=JSON.stringify(rabbit);
const obj=JSON.parse(json,(key,value)=>{
    console.log(`Key: ${key}, value:${value}`);
    return key ==='birthDate' ? new Date(value) : value;
});
console.log(obj);
// rabbit.jump();
// obj.jump(); --> 오류발생

console.log(rabbit.birthDate.getDate());
console.log(obj.birthDate);

'front > HTML&CSS&JS' 카테고리의 다른 글

JS [promise]  (0) 2022.01.25
JS [call back]  (0) 2022.01.25
JS [array API]  (0) 2022.01.24
JS [array]  (0) 2022.01.24
JS [Object]  (0) 2022.01.24