[TIL 23] StringifyJSON

yezo cha·2021년 6월 16일
0

JavaScript

목록 보기
14/19
post-thumbnail

JSON(JavaScript Object Notation)

데이터 교환을 위해 만들어진 객체 형태의 포맷.

객체는 타입 변환을 이용해 String으로 변환할 경우 객체 내용을 포함하지 않는다. JavaScript에서 객체에 메소드(message.toString())나 형변환(String(message))을 시도하면, [object Object] 라는 결과를 리턴한다.

객체를 JSON의 형태로 변환하거나 JSON을 객체의 형태로 변환하면 가능하다.

  • JSON.stringify : Object typeJSON으로 변환.
  • JSON.parse : JSONObject type으로 변환.

JSON.stringify()

JSON.stringify()Object typeJSON 문자열으로 변환시켜주는 함수이다.
자바스크립트 객체와 구조는 같지만, 객체가 아닌 문자열로서 존재한다.

개발자 도구에서 __proto__ : Object를 통해 객체임을 확인할 수 있다.
User 객체를 JSON.stringify()함수를 사용해서 출력해보자.

개발자 도구에서 확인하면 문자열로 출력되는 것을 확인할 수 있다.
객체가 아니기 때문에 __proto__ : Object는 확인할 수 없다.

Array 객체의 경우에도 JSON.stringify()를 통해 json 문자열로 만들 수 있다.

fruits 배열이 __proto__: Array로 Array 객체로서 인식한 것을 확인할 수 있다.

mdn 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.stringify(new Date(2006, 0, 2, 15, 4, 5))
// '"2006-01-02T15:04:05.000Z"'

JSON.stringify({ x: 5, y: 6 });
// '{"x":5,"y":6}' or '{"y":6,"x":5}'
JSON.stringify([new Number(1), new String('false'), new Boolean(false)]);
// '[1,"false",false]'

// Symbols:
JSON.stringify({ x: undefined, y: Object, z: Symbol('') });
// '{}'
JSON.stringify({ [Symbol('foo')]: 'foo' });
// '{}'
JSON.stringify({ [Symbol.for('foo')]: 'foo' }, [Symbol.for('foo')]);
// '{}'
JSON.stringify({ [Symbol.for('foo')]: 'foo' }, function(k, v) {
  if (typeof k === 'symbol') {
    return 'a symbol';
  }
});
// '{}'

// Non-enumerable properties:
JSON.stringify( Object.create(null, { x: { value: 'x', enumerable: false }, y: { value: 'y', enumerable: true } }) );
// '{"y":"y"}'

JSON.parse()

JSON.parse()JSON 문자열Object type으로 변환해주는 역할을 한다.
JSON.parse()를 사용해서 __proto__ : Object가 확인 되는 것을 알 수 있다.

mdn JSON.parse()

profile
(ง •̀_•́)ง

0개의 댓글