JSON

🎃 JSON (JavaScript Object Notation)

• 데이터를 주고받을 때(저장 혹은 전송할 때) 많이 사용되는 경량의 DATA 교환 형식
• Javascript에서 객체를 만들 때 사용하는 표현식을 의미.
  ❗ JSON은 데이터 포맷일 뿐이며, 어떠한 통신 방법도 프로그래밍 문법도 아닌 단순히 데이터를 표시하는 표현 방법일 뿐이다.

🐥 JSON 특징

• Server와 Client 간의 교류에서 일반적으로 많이 사용된다.
• 자바스크립트를 이용하여 JSON 형식의 문서를 쉽게 자바스크립트 객체로 변환할 수 있는 이점이 있다.
• JSON 문서 형식은 자바스크립트 객체의 형식을 기반으로 만들어졌다.
  (자바스크립트 객체 표기법(key:value pairs) 과 아주 유사하다)
• 자바스크립트의 문법과 굉장히 유사하지만 텍스트 형식일 뿐이다.
• 다른 프로그래밍 언어를 이용해서도 쉽게 만들 수 있다.
• 특정 언어에 종속되지 않으며, 대부분의 프로그래밍 언어에서 JSON 포맷의 데이터를 핸들링 할 수 있는 라이브러리를 제공한다.

JSON.stringify – 객체를 JSON으로 바꿔줍니다.
JSON.parse – JSON을 객체로 바꿔줍니다.

// 1) Object to JSON  >> stringify API

// Boolean 형태 JSON으로 변환
let json = JSON.stringify(true);
console.log(json)  // true

// Array 형태 JSON으로 변환
let json = JSON.stringify( ['a', 'b', 'c'] );
console.log(json)  // ["a", "b", "c"] 

// String 형태 JSON으로 변환
let json = JSON.stringify('text');
console.log(json)  // "text"

// Object 형태 JSON으로 변환
const rabbit = {
    name: 'nana',
    color: 'white',
    size: null,
    birthDate: new Date(),
    jump: () => {
    	console.log(`${name} can jump!`);
    },
};

let json = JSON.stringify(rabbit);
console.log(json)  
// {"name": "nana", "color": "white", "size": null, "birthDate": "2021-04-07T20:22.670Z" }
// jump function 형태는  JSON으로 변환되지 않는다.

// 중첩 객체도 JSON으로 변환
const meetup = {
  title: "Conference",
  room: {
    number: 23,
    participants: ["john", "ann"]
  }
};

let json = JSON.stringify(meetup);
console.log(json)
//{
//  "title":"Conference",
//  "room":{"number":23,"participants":["john","ann"]},
// }



// 2) JSON to Object  >> parse API

let json = JSON.stringify(rabbit);  // JSON으로 변환
let obj = JSON.parse(json);   // 다시 자바스크립트로 변환
console.log(obj)  

🐥 JSON 문법

• JSON 형식은 자바스크립트 객체와 마찬가지로 key / value가 존재할 수 있으며 key값이나 문자열은 항상 쌍따옴표("")를 이용하여 표기해야한다.
• 객체, 배열 등의 표기를 사용할 수 있다.
• 일반 자바스크립트의 객체처럼 원하는 만큼 중첩시켜서 사용할 수도 있다.
• JSON형식에서는 null, number, string, array, object, boolean을 사용할 수 있다.
  (symbol 이나 function 형태나 값이 undefined인 프로퍼티는 안된다)

{
  "employees": [
    {
      "name": "Yerim",
      "lastName": "Ko"
    },
    {
      "name": "Ajin",
      "lastName": "Woo"
    },
    {
      "name": "Bokja",
      "lastName": "Park"
    } 
  ]
}