JSON 기초

JSON

JSON : JavaScript Object Notation
즉, 자바스크립트 객체 문법에 토대를 둔, 문자 기반의 데이터 교환 형식

JSON의 구조

일반적인 JSON 구조는 자바스크립트 객체 리터럴 작성법을 따른다. 자바스크립트의 원시 자료형인 문자열, 숫자, 불리언을 가질 수 있고, 중첩된 계층 구조 또한 가질 수 있다.

단, 차이도 있는데 작은 따옴표(')는 허용되지 않고, 큰 따옴표(")만 허용된다. 또 객체의 key를 큰 따옴표로 문자열 취급을 해주어야 한다.

JSON의 메서드

JSON -> 문자열 형태 -> 서버-클라이언트 간 데이터 전송 시에 사용한다.
하지만 이 과정을 위해 파싱(parsing) 과정이 필요하다.

1. JS객체를 JSON 형태로 전송
2. JSON 형태를 JS 객체 형태로 사용

stringify()

: 자바스크립트 객체 -> JSON 문자열로 변환. 네트워크를 통해 객체를 JSON 문자열로 변환할 때 주로 사용함

console.log(JSON.stringify({ x: 5, y: 6 }));
// Expected output: "{"x":5,"y":6}"

console.log(JSON.stringify([new Number(3), new String('false'), new Boolean(false)]));
// Expected output: "[3,"false",false]"

console.log(JSON.stringify({ x: [10, undefined, function(){}, Symbol('')] }));
// Expected output: "{"x":[10,null,null,null]}"

console.log(JSON.stringify(new Date(2006, 0, 2, 15, 4, 5)));
// Expected output: ""2006-01-02T15:04:05.000Z""

parse()

: JSON 문자열 -> 자바스크립트 객체 변환. 네트워크 통신의 결과를 통해 받아온 JSON 문자열을 프로그램 내부에서 사용하기 위해 JS 객체로 변환할 때 사용.

const json = '{"result":true, "count":42}';
const obj = JSON.parse(json);

console.log(obj.count);
// Expected output: 42

console.log(obj.result);
// Expected output: true

JSONPlaceholder

이 웹사이트에서 mock API(가짜 API)를 송신 받을 수 있다.
테스트를 할 때 guide에 맞춰 활용하면 좋다.