[KDT] JSON

JSON(JavaScript Object Notation) 

 

: 자바스크립트 데이터를 표현하는 하나의 포맷

속성-값(attribute-value)의 쌍, 객체 데이터의 형태와 유사

인간이 읽을 수 있는 텍스트를 사용하는 개방형 표준 포맷

비동기 브라우저/ 서버 통신(AJAX)을 위해, 그리고 넓게는 XML을 대체하는 주요한 데이터 포맷

특히, 인터넷에서 자료를 주고 받을 때 그 자료를 표현하는 방법.

JSON의 공식 인터넷 미디어 타입은 application/json이며, JSON의 파일 확장자는 .json이다.

 

- 기본 자료형

• 수
• 문자열: 0개 이상의 유니코드 문자들의 연속. 문자열은 큰 따옴표로 구분하며 역슬래시를 통한 이스케이프 문법 지원
• 불리언: 참, 거짓
• 배열: 순서가 있는 리스트
• 객체
• 널: 빈 값으로 null 사용

 

const str = JSON.stringify(변수명)

 

위의 JSON은 자바스크립트의 전체 영역에서 사용할 수 있는 전역객체(JS에 기본적으로 설정되어 있음)

stringify라는 메서드는 자료형이 객체 등의 다양한 형태인 변수를 문자열화시켜주는 메서드이다 !

그렇게 문자열화시킨 데이터를 원래대로의 자료형으로 바꿔주는 메서드는 parse이다 !

 

 

 

 

사용되는 용도가 데이터 통신에 주로 있으므로, 형태에 있어 경량화는 필수인 상황. => 문자열화(JSON화)

 

 

 

 

 

JS의 전역객체인 localStorage를 통해 키와 값의 쌍의 형태로 데이터를 저장할 때,

문자열 데이터로 전환해서 저장해야 한다 !

- JS 데이터를 문자열화하는 JSON.stringify(데이터/ 변수명) 메서드 사용

ex) localStorage.setItem('myData', JSON.stringify(myData))

 

반대로 localStorage에서 데이터를 불러와 다시 원래 상태의 자료형으로 변환해서 사용할 때는,

JSON.parse(데이터/ 변수명) 메서드 사용

ex) JSON.parse(localStorage.getItem('myData'))

 

 

 

 

Lodash라는 패키지의 기능을 기반 및 활용해서 로컬 스토리지를 하나의 DB처럼 쉽게 관리할 수 있다.

=> 패키지 lowdb : 작은 JSON 기반의 데이터베이스

 

https://github.com/typicode/lowdb

GitHub - typicode/lowdb: Simple to use local JSON database. Use native JavaScript API to query. Written in TypeScript. (supports

 

 

 

 

 

API JSON 파일을 HTTP 요청시 처리해주는, 원하는대로(객체 형태로) 만들어주는 패키지로 axios가 있다.

 

https://github.com/axios/axios

GitHub - axios/axios: Promise based HTTP client for the browser and node.js