[ Javascript 코딩 ] JSON.stringify() - javascript 값을 JSON string 으로 변환하기

안녕하세요. 제임스 입니다. 

웹서버와 클라이언트 사이에서 통신을 하기 위해서는 문자열을 이용합니다. 클라이언트에서 사용하는 javascript 객체를 웹서버로 보내기 위해 많이 사용하는 것이 JSON 입니다. 

(앞선 포스팅 내용을 간단히 정리 했습니다)

JSON 의 stringify() 라는 함수를 이용하여 javascript 객체를 JSON 문자열로 변환할 수 있습니다. 

Syntax

JSON.stringify ( value[, replacer[, space]] )

stringify 는 사전적 의미로는 아래와 같습니다. 

• (computing) To convert to a textual representation.

"(컴퓨터 언어로) 텍스트 표현으로 변환한다"는 의미가 됩니다. 

즉, 여기서는 입력받은 값을 JSON 문자열로 변환한다는 의미가 됩니다. (한글 번역은 없습니다)

Parameters

value

JSON string (문자열)로 변환하고자 하는 javasript 객체

replacer (Optional - 선택적)

문자열화 프로세스의 동작을 변경하는 함수 또는 JSON 문자열에 포함될 객체의 속성을 선택 / 필터링하기 위한 화이트리스트 역할을 하는 String 및 Number 객체의 배열

이 값이 null 이거나 제공되지 않을 경우 객체의 모든 속성이 결과 JSON 문자열에 포함

space (Optional - 선택적)

가독성을 위해 출력 JSON 문자열에 공백을 삽입하는데 사용되는 String 또는 Number 객체

• Number - 공백분자로 사용할 공백 문자 수를 의미함. 최대 10, 10 이상의 값일 경우 10으로 적용
• String - 문자열이 공백으로 사용됨

space 값이 null 이거나 제공되지 않을 경우 공백이 사용되지 않음

위 내용을 요약하자면...

JSON string 으로 변환하고자 하는 value 값은 필수 입력 값이지만 객체 속성을 선택 / 필터링 하기 위한 replcacer 와 공백문자열을 지정하는 space 는 선택적으로 입력 또는 입력 하지 않아도 됩니다. 

Description

■ Boolean, Number 및 String 객체들이 변환될때는 각각의 primitive type 에 맞는 값으로 변환됩니다. 

console.log(JSON.stringify({x: 1004, y: 7942}));

x 및 y 값을 Number 로 입력 했습니다. 

JSON 문자열로 변환된 값은 아래와 같습니다. 

"{"x":1004,"y":7942}"

console.log(JSON.stringify({x: 'true', y: 'false'}));

x 및 y 값을 String 형으로 입력 했습니다. 

JSON 문자열로 변환된 값은 아래와 같습니다. 

"{"x":"true","y":"false"}"

console.log(JSON.stringify({x: true, y: false}));

x 및 y 값을 boolean 형으로 입력 했습니다. 

JSON 문자열로 변환된 값은 아래와 같습니다. 

"{"x":true,"y":false}"

바로 앞서 문자열 true / false 와 달리 double quotation marks ( " " ) 가 달려 있지 않습니다.

■ 만약 변환 중 undefined, 함수 또는 Symbol 이 객체에서 발견되면 undefined 가 리턴되며 array 에서 발견되면 null 을 리턴 합니다. 

console.log(JSON.stringify(undefined));
console.log(JSON.stringify(function(){}));
console.log(JSON.stringify(Symbol('')));

위 코드의 결과 값은 아래와 같습니다. 

undefined

undefined

undefined

객체에서 undefined, 함수 또는 Symbol 이 들어왔기 대문에 undefined 로 리턴 되었습니다. 

console.log(JSON.stringify([undefined, function(){}, Symbol('')] ));

위 코드는 객체가 아닌 배열 (array) 에 undefined, 함수 그리고 Symbol 이 들어 왔습니다. 

결과는 아래와 같습니다. 

[null,null,null]

배열에서 위 값들이 들어 올 경우 null 로 리턴 됩니다. 

■ Number Infinity 와 NaN 그리고 객체 null 등은 모두 null 로 리턴됩니다. 

console.log(JSON.stringify(NaN));
console.log(JSON.stringify(null));
console.log(JSON.stringify(Infinity));

위 코드 실행 결과는 아래와 같습니다. 

null

null

null

console.log(JSON.stringify([NaN, null, Infinity]));

위 코드 실행 결과는 아래와 같습니다. 

[null,null,null]

▼ 도움이 되셨다면 로그인이 필요 없는 ▼

▼ 하트 클릭 한번 부탁 드립니다 ▼

감사합니다 :D