드림코딩 자바스크립트 기초강의 정리10

Dongwoo Kim·2021년 7월 20일
0

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

JSON이란? : JavaScript Object Notation의 약자로, 자바스크립트의 오브젝트(key, value)을 이용한 체계이다. 주로 데이터 전송 시 사용하며, 언어와 상관없이 사용 가능하다!

//JSON
//JavaScript Object Notation

//1. Object to JSON
//stringify(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": json.null, "birthDate": "2021-07-20...",}

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

json = JSON.stringify(rabbit, (key, value) => {
	console.log(`key: ${key}, value: ${value}`);
  	return value
});
console.log(json);// 세밀하게 통제하고 싶을 때 사용

//2. JSON to Object
//parse(json)
json = JSON.stringify(rabbit);
const obj = JSON.parse(json, (key, value) => {
	return key === 'birthDate' ? new Date(value) : value;
});// 콜백함수 reviver을 통하여 세밀하게 구할 수 있다.
console.log(obj); //{name: 'tori',color: 'white',size: null,birthDate: "2021-07-20..."}
obj.jump(); //Error!(메소드 포함 x)

console.log(rabbit.birthDate.getDate());
console.log(obj.birthDate.getDate());
//데이터간 비교 : JSON diff, 
//JSON 정리: JSON beautifier,
//JSON => object: JSON Parser,
//JSON 유효성 검사: JSON Validator
profile
水滴石穿

0개의 댓글