# JSON (JavaScript Object Notation)

값이나 객체를 나타내주는 범용 포맷으로 js에서 사용할 목적으로 만들어진 포맷이나 현재 다른 언어에서도 json을 많이 이용하고 있다.

<br>

## JSON 포맷

* 프로퍼티 이름(key)과 값(value)는 큰따옴표로 감싸야한다. *(작은 따옴표 x)*
* new를 사용할 수 없다.

<br>

## 관련 매서드

* JSON.stringify(obj) : 객체를 JSON으로 변환

  * 함수 파라미터

    ```js
    let json = JSON.stringify(value[, replacer, space])
    ```

    * value : 인코딩 하려는 값

      ```js
      let student = {
        name: 'John',
        age: 30,
        isAdmin: false,
        courses: ['html', 'css', 'js'],
        wife: null,
      };
      let json = JSON.stringify(student);

      alert(typeof json); // string
      alert(json);
      /* JSON으로 인코딩된 객체:
      {
          "name": "John",
          "age": 30,
          "isAdmin": false,
          "courses": ["html", "css", "js"],
          "wife": null
      }
      */
      ```
    * replacer : 인코딩 하길 원하는 프로퍼티가 담긴 배열 or 매핑 함수

      > 순환 참조를 다뤄야 하는 경우에 정교하게 조정하기 위해 사용

      ```js
      let room = {
        number: 23,
      };

      let meetup = {
        title: 'Conference',
        participants: [{ name: 'John' }, { name: 'Alice' }],
        place: room, // meetup은 room을 참조합니다
      };

      room.occupiedBy = meetup; // room은 meetup을 참조합니다

      alert(
        JSON.stringify(meetup, function replacer(key, value) {
          alert(`${key}: ${value}`);
          return key == 'occupiedBy' ? undefined : value;
        })
      );

      alert(JSON.stringify(meetup, ['title', 'participants', 'place', 'name', 'number']));
      ```
    * space : 서식 변경 목적으로 사용할 공백 문자 수

      ```js
      let user = {
        name: 'John',
        age: 25,
        roles: {
          isAdmin: false,
          isEditor: true,
        },
      };

      alert(JSON.stringify(user, null, 2));
      /* 
      {
          "name": "John",
          "age": 25,
          "roles": {
              "isAdmin": false,
              "isEditor": true
          }
      }
      */

      alert(JSON.stringify(user, null, 4));
      /*
      {
          "name": "John",
          "age": 25,
          "roles": {
              "isAdmin": false,
              "isEditor": true
          }
      }
      */
      ```

  변환된 string을 JSON으로 `인코딩된` | `직렬화 처리된` | `문자열로 변환된` | `결집된` 객체라고 부른다.

  * 객체, 배열, 원시자료형도 적용할 수 있다.

    > 메서드, key가 심볼형 프로퍼티, 값이 undefiend인 프로퍼티는 무시한다.

    * 객체가 순환 참조가 있다면 변환을 실패한다. *(Error)*
* toJSON() : 객체 내부에 함수가 정의 되어 있으면 `JSON.stringify()`함수 호출시 `toJSON()`이 호출 된다.
* JSON.parse : JSON을 객체로 변환
  * 함수 파라미터

    ```js
    let value = JSON.parse(str, [reviver]);
    ```

    * str : JSON형식의 문자열
    * reviver : 모든 (key,value) 쌍을 대상으로 호출되는 function(key,value)형태의 함수로 값을 변경시킬 수 있다.

      아래와 같이 date를 그대로 parse이용해 객체로 변환시 date정보를 Date 객체가 아닌 문자열로 받았기 때문에 `meetup.date.getDate()`시 에러가 발생한다.

      따라서 아래와 같이 `reviver`를 이용해 객체로 변환시켜줄 수 있다.

      ```js
      let schedule = `{
          "meetups": [
              {"title":"Conference","date":"2017-11-30T12:00:00.000Z"},
              {"title":"Birthday","date":"2017-04-18T12:00:00.000Z"}
          ]
      }`;

      schedule = JSON.parse(schedule, function (key, value) {
        if (key == 'date') return new Date(value);
        return value;
      });

      alert(schedule.meetups[1].date.getDate());
      ```


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://nelmm.gitbook.io/til/javascript/core/json.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.