JSON
JSON은 프로그램 사이에서 데이터 교환을 위한 객체 형태의 포맷
객체는 타입 변환을 이용해 String으로 변환할 경우 객체 내용을 포함하지 않는다. JavaScript에서 객체에 메소드(message.toString())나 형변환(String(message))을 시도하면, [object Object] 라는 결과를 리턴한다.
이 문제를 해결하는 방법은 객체를 JSON의 형태로 변환하거나 JSON을 객체의 형태로 변환하는 방법이 있다.
- JSON.stringify : Object type을 JSON으로 변환합니다.
- JSON.parse : JSON을 Object type으로 변환합니다.
JSON의 기본 규칙
| 자바스크립트 객체 | JSON | |
|---|---|---|
| 키 | 키는 따옴표 없이 쓸 수 있음 | 반드시 큰따옴표를 붙여야 함 |
| 문자열 값 | 문자열 값은 어떠한 형태의 따옴표도 사용 가능 | 반드시 큰따옴표로 감싸야 함 |
JSON.stringify()
JSON.stringify() 메서드는 JavaScript 값이나 객체를 JSON 문자열로 변환
const json = { "result": true, "count": 42 }
const json2 = "hello"
const json3 = true
const obj = JSON.stringify(json);
const obj2 = JSON.stringify(json2);
const obj3 = JSON.stringify(json3);
//
> '{"result":true,"count":42}'
> '"hello"'
> "true"
//JSON.parse()
JSON.parse() 메서드는 JSON 문자열의 구문을 분석하고, 그 결과에서 JavaScript 값이나 객체를 생성한다.
const json = '{"result":true, "count":42}';
const json2 = '"hello"'
const json3 = 'true'
const obj = JSON.parse(json);
const obj2 = JSON.parse(json2);
const obj3 = JSON.parse(json3);
//
> Object { result: true, count: 42 }
> "hello"
> true
//과제
1. 재귀를 이용하여 메소드 JSON.stringify를 구현하라
각 데이터 타입이 어떻게 JSON 형태로 변환되는지 확인할 수 있었다.
데이터 타입을 JSON 형태로 변환한 모습은 다음과 같다.
- Boolean
stringifyJSON(true); // 'true' - String
stringifyJSON('foo'); // '"foo"' ("\"foo\"") - Array
stringifyJSON([1, 'false', false]); // '[1,"false",false]' - Object
stringifyJSON({ x: 5 }); // '{"x":5}' - undefined, function
stringifyJSON(undefined) // undefined
stringifyJSON(function(){}) // undefined
stringifyJSON({ x: undefined, y: function(){} }) // '{}'
2. Tree UI
자세한 사항은 다음 링크에 정리해 두었다.
start coding