IT 개발자가 되기위한 여정

컴퓨터 공부를 시작함에 앞서 계획 및 개발에 대한 내용을 풀어나갈 생각입니다.

IT 학습/Javascript

JSON이란? JSON.parse() 와 JSON.stringify()에 대해

제로시엘 2022. 9. 7. 12:17

시작하기에 앞서

 

코드 리뷰와 관련 자료들 중 앞으로 사용하게 될 기술들과 잘 몰랐던 기술들을 짧게 정리하고

 

요점을 적어두고 다시 활용하기 위한 글입니다.


JSON.parse() 와 JSON.stringify()

JSON은 JavaScript Object Notation의 약자로서 데이터를 문자열의 형태로 나타내기 위해서 사용됩니다. 이름이 암시하듯 JSON은 본래 자바스크립트에서 파생되었지만 현재는 거의 표준으로 자리잡아 대부분의 다른 프로그래밍 언어에서도 지원하는 데이터 포멧입니다. JSON은 특히 네트워크를 통해 서로 다른 시스템들이 데이터를 주고 받을 때 많이 사용되기 때문에 어렵지 않게 접할 수 있습니다.

 

이중 자바스크립트 내장객체인 JSON.parse()와 JSON.stringify()를 이용해서 객체 <-> Json간의 변경을 할 수 있습니다.

 

JSON.stringify()

JSON.stringify({});                  // '{}'
JSON.stringify(true);                // 'true'
JSON.stringify('foo');               // '"foo"'
JSON.stringify([1, 'false', false]); // '[1,"false",false]'
JSON.stringify({ x: 5 });            // '{"x":5}'

이 때 내부값이 JSON으로 일렬정렬 되기 때문에 보기가 불편하다면 아래와 같이 이용할 수 있습니다.

JSON.stringify({ uno: 1, dos: 2 }, null, '\t');
// returns the string:
// '{
//     "uno": 1,
//     "dos": 2
// }'

 

JSON.parse()

JSON.parse('{}');              // {}
JSON.parse('true');            // true
JSON.parse('"foo"');           // "foo"
JSON.parse('[1, 5, "false"]'); // [1, 5, "false"]
JSON.parse('null');            // null

 

맵과 유사하게 2번째 인자를 함수로 사용하여 다음과 같은 변환이 가능합니다.

JSON.parse('{"1": 1, "2": 2, "3": {"4": 4, "5": {"6": 6}}}', (key, value) => {
  console.log(key); // 현재 속성명 출력, 마지막은 빈 문자열("")
  return value;     // 변환하지 않고 그대로 반환
});