[JS/JSON] JSON(; JavaScript Object Notaion)

2022. 6. 14. 12:29·Stack/JavaScript

JSON(JavaScript Object Notaion)

서버와 데이터를 전송할 때 사용되는 데이터포맷

자바스크립트의 객체를 보고 만든 데이터 포맷

텍스트를 기반으로 하여 가벼움

데이터를 직렬화하여 전송할 때 쓰임

프로그램 언어나 플랫폼에 상관없이 쓸 수 있음

 

XML -> JSON

 

자바스크립트 객체 -> 직렬화-> JSON

JSON -> 자바스크립트 객체

 

1. object to JSON

JSON.stringify(obj)

 

2. JSON to object

JSON.parse(json)

 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        const rabbit = {
            name: 'tory',
            color: 'white',
            size: 'small',
            birthDay: new Date(),
            jump: () => {
                console.log("점프할 수 있음");
            }
        }
        // JSON.stringify(obj)
        let json = JSON.stringify(rabbit);
        console.log(rabbit);
        console.log(json);

        // JSON.parse(json)
        let obj = JSON.parse(json);
        console.log(obj);
        let obj2 = JSON.parse(json, (key, value)=> {
            return key === 'birthDay' ? new Date(value) : value;
        })
        console.log(obj2);
    </script>
</body>
</html>

'Stack > JavaScript' 카테고리의 다른 글

[JS/JSON] ShoppingList  (0) 2022.06.15
[JS] 동기 / 비동기 / 프로미스  (0) 2022.06.15
[JS] 클래스 복습  (0) 2022.06.14
[JS] 배열 / 객체 / set 복습  (0) 2022.06.13
[JS] 로딩 (로드시 이벤트 설정하기)  (0) 2022.06.13
'Stack/JavaScript' 카테고리의 다른 글
  • [JS/JSON] ShoppingList
  • [JS] 동기 / 비동기 / 프로미스
  • [JS] 클래스 복습
  • [JS] 배열 / 객체 / set 복습
7ingout
7ingout
  • 7ingout
    Hello, 7ingout world!
    7ingout
  • 전체
    오늘
    어제
    • 분류 전체보기 (205)
      • Project (5)
      • Stack (173)
        • React (40)
        • JavaScript (50)
        • TypeScript (14)
        • HTML (11)
        • CSS (31)
        • Spring (9)
        • PHP (15)
        • SQL (3)
        • Python (0)
      • ETC (9)
      • Design (13)
        • Illustrator (6)
        • Photoshop (7)
      • Articloid (4)
        • 7ingout (4)
  • 공지사항

    • ☻
  • 인기 글

  • 최근 글

  • hELLO· Designed By정상우.v4.10.0
7ingout
[JS/JSON] JSON(; JavaScript Object Notaion)
상단으로

티스토리툴바