aboutsummaryrefslogtreecommitdiff
path: root/files/ko/web/javascript/reference/global_objects/json/stringify/index.html
diff options
context:
space:
mode:
Diffstat (limited to 'files/ko/web/javascript/reference/global_objects/json/stringify/index.html')
-rw-r--r--files/ko/web/javascript/reference/global_objects/json/stringify/index.html230
1 files changed, 230 insertions, 0 deletions
diff --git a/files/ko/web/javascript/reference/global_objects/json/stringify/index.html b/files/ko/web/javascript/reference/global_objects/json/stringify/index.html
new file mode 100644
index 0000000000..12de82705b
--- /dev/null
+++ b/files/ko/web/javascript/reference/global_objects/json/stringify/index.html
@@ -0,0 +1,230 @@
+---
+title: JSON.stringify()
+slug: Web/JavaScript/Reference/Global_Objects/JSON/stringify
+tags:
+ - JSON
+ - JavaScript
+ - Method
+ - Reference
+translation_of: Web/JavaScript/Reference/Global_Objects/JSON/stringify
+---
+<div>{{JSRef}}</div>
+
+<p><span class="seoSummary"><strong><code>JSON.stringify()</code></strong> 메서드는 JavaScript 값이나 객체를 JSON 문자열로 변환합니다.</span> 선택적으로, <code>replacer</code>를 함수로 전달할 경우 변환 전 값을 변형할 수 있고, 배열로 전달할 경우 지정한 속성만 결과에 포함합니다.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/json-stringify.html")}}</div>
+
+
+
+<h2 id="구문">구문</h2>
+
+<pre class="syntaxbox notranslate">JSON.stringify(<var>value</var>[, <var>replacer</var>[, <var>space</var>]])</pre>
+
+<h3 id="매개변수">매개변수</h3>
+
+<dl>
+ <dt><code>value</code></dt>
+ <dd>JSON 문자열로 변환할 값.</dd>
+ <dt><code>replacer</code> {{optional_inline}}</dt>
+ <dd>문자열화 동작 방식을 변경하는 함수, 혹은 JSON 문자열에 포함될 값 객체의 속성들을 선택하기 위한 화이트리스트(whitelist)로 쓰이는 {{jsxref("String")}} 과 {{jsxref("Number")}} 객체들의 배열. 이 값이 null 이거나 제공되지 않으면, 객체의 모든 속성들이 JSON 문자열 결과에 포함된다.</dd>
+</dl>
+
+<dl>
+ <dt><code>space</code> {{optional_inline}}</dt>
+ <dd>가독성을 목적으로 JSON 문자열 출력에 공백을 삽입하는데 사용되는 {{jsxref("String")}} 또는 {{jsxref("Number")}} 객체. 이것이 <code>Number</code> 라면, 공백으로 사용되는 스페이스(space)의 수를 나타낸다; 이 수가 10 보다 크면 10 으로 제한된다. 1 보다 작은 값은 스페이스가 사용되지 않는 것을 나타낸다. 이것이 <code>String</code> 이라면, 그 문자열(만약 길이가 10 보다 길다면, 첫번째 10 개의 문자)이 공백으로 사용된다. 이 매개 변수가 제공되지 않는다면(또는 null 이면), 공백이 사용되지 않는다.</dd>
+</dl>
+
+<h3 id="반환_값">반환 값</h3>
+
+<p>주어진 값과 대응하는 JSON 문자열.</p>
+
+<h3 id="예외">예외</h3>
+
+<p>순환 참조를 발견할 경우 {{jsxref("TypeError")}}(<code>cyclic object value</code>).</p>
+
+<h2 id="설명">설명</h2>
+
+<p><code>JSON.stringify()</code>는 값을 JSON 표기법으로 변환한다.</p>
+
+<ul>
+ <li>배열이 아닌 객체의 속성들은 어떤 특정한 순서에 따라 문자열화 될 것이라고 보장되지 않는다. 같은 객체의 문자열화에 있어서 속성의 순서에 의존하지 않는다.</li>
+ <li>{{jsxref("Boolean")}}, {{jsxref("Number")}}, {{jsxref("String")}} 객체들은 문자열화 될 때 전통적인 변환 의미에 따라 연관된 기본형(primitive) 값으로 변환된다.</li>
+ <li>{{jsxref("undefined")}}, 함수, 심볼(symbol)은 변환될 때 생략되거나(객체 안에 있을 경우) {{jsxref("null")}} 로 변환된다(배열 안에 있을 경우).</li>
+ <li>심볼을 키로 가지는 속성들은 <code>replacer</code> 함수를 사용하더라도 완전히 무시된다.</li>
+ <li>열거 불가능한 속성들은 무시된다.</li>
+</ul>
+
+<pre class="brush: js notranslate">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"}'
+
+</pre>
+
+<h3 id="replacer_매개_변수"><code>replacer</code> 매개 변수</h3>
+
+<p><code>replacer</code> 매개변수는 함수 또는 배열이 될 수 있다. 함수일 때는 문자열화 될 key 와 value, 2개의 매개변수를 받는다. key 가 발견된 객체는 리플레이서의 <code>this</code> 매개변수로 제공된다. 맨 처음에는 문자열화될 그 객체를 나타내는 비어 있는 key와 함께 호출되고, 그 다음에는 문자열화될 그 객체나 배열의 각 속성에 대해 호출된다. 이것은 JSON 문자열에 추가되어야 하는 값을 반환해야한다:</p>
+
+<ul>
+ <li>{{jsxref("Number")}} 를 반환하면, JSON 문자열에 추가될 때 그 수를 나타내는 문자열이 그 속성의 값으로 사용된다.</li>
+ <li>{{jsxref("String")}} 을 반환하면, 그것이 JSON 문자열에 추가될 때 속성의 값으로 사용된다.</li>
+ <li>{{jsxref("Boolean")}} 을 반환하면, 그것이 JSON 문자열에 추가될 때 "true" 또는 "false" 이 속성의 값으로 사용된다.</li>
+ <li>다른 객체를 반환하면, 그 객체는 <code>replacer</code> 함수를 각각의 속성에 대해 호출하며 순환적으로 JSON 문자열로 문자열화된다. 그 객체가 함수인 경우에는 JSON 문자열에 아무것도 추가되지 않는다.</li>
+ <li><code>undefined</code> 를 반환하면, 그 속성은 JSON 문자열 결과에 포함되지 않는다.</li>
+</ul>
+
+<div class="note"><strong>유의:</strong> <code>replacer</code> 함수를 배열로부터 값을 제거하기위해 사용할 수 없다. 만약 <code>undefined</code> 나 함수를 반환한다면 <code>null</code> 이 대신 사용될 것이다.</div>
+
+<h4 id="함수에_대한_예제">함수에 대한 예제</h4>
+
+<pre class="brush: js notranslate">function replacer(key, value) {
+ if (typeof value === "string") {
+ return undefined;
+ }
+ return value;
+}
+
+var foo = {foundation: "Mozilla", model: "box", week: 45, transport: "car", month: 7};
+var jsonString = JSON.stringify(foo, replacer);
+</pre>
+
+<p>JSON 문자열 결과는 <code>{"week":45,"month":7}</code> 이다.</p>
+
+<h4 id="배열에_대한_예제">배열에 대한 예제</h4>
+
+<p><code>replacer</code> 가 배열인 경우, 그 배열의 값은 JSON 문자열의 결과에 포함되는 속성의 이름을 나타낸다.</p>
+
+<pre class="brush: js notranslate">JSON.stringify(foo, ['week', 'month']);
+// '{"week":45,"month":7}', 단지 "week" 와 "month" 속성을 포함한다
+</pre>
+
+<h3 id="space_매개_변수"><code>space</code> 매개 변수</h3>
+
+<p><code>space</code> 매개변수는 최종 문자열의 간격을 제어한다. 숫자일 경우 최대 10자 만큼의 공백 문자 크기로 들여쓰기되며, 문자열인 경우 해당 문자열 또는 처음 10자 만큼 들여쓰기 된다.</p>
+
+<pre class="brush: js notranslate">JSON.stringify({ a: 2 }, null, ' ');
+// '{
+// "a": 2
+// }'
+</pre>
+
+<p>'\t'를 사용하면 일반적으로 들여쓰기 된 코드스타일과 유사함.</p>
+
+<pre class="brush: js notranslate">JSON.stringify({ uno: 1, dos: 2 }, null, '\t');
+// returns the string:
+// '{
+// "uno": 1,
+// "dos": 2
+// }'
+</pre>
+
+<h3 id="toJSON_작동"><code>toJSON()</code> 작동</h3>
+
+<p>If an object being stringified has a property named <code>toJSON</code> whose value is a function, then the <code>toJSON()</code> method customizes JSON stringification behavior: instead of the object being serialized, the value returned by the <code>toJSON()</code> method when called will be serialized. For example:</p>
+
+<pre class="brush: js notranslate">var obj = {
+ foo: 'foo',
+ toJSON: function() {
+ return 'bar';
+ }
+};
+JSON.stringify(obj); // '"bar"'
+JSON.stringify({ x: obj }); // '{"x":"bar"}'
+</pre>
+
+<h3 id="Example_of_using_JSON.stringify_with_localStorage">Example of using <code>JSON.stringify()</code> with <code>localStorage</code></h3>
+
+<p>In a case where you want to store an object created by your user and allowing it to be restored even after the browser has been closed, the following example is a model for the applicability of <code>JSON.stringify()</code>:</p>
+
+<div class="warning">
+<p>Functions are not a valid JSON data type so they will not work. However, they can be displayed if first converted to a string (e.g. in the replacer), via the function's toString method. Also, some objects like {{jsxref("Date")}} will be a string after {{jsxref("JSON.parse()")}}.</p>
+</div>
+
+<pre class="brush: js notranslate">// Creating an example of JSON
+var session = {
+ 'screens': [],
+ 'state': true
+};
+session.screens.push({ 'name': 'screenA', 'width': 450, 'height': 250 });
+session.screens.push({ 'name': 'screenB', 'width': 650, 'height': 350 });
+session.screens.push({ 'name': 'screenC', 'width': 750, 'height': 120 });
+session.screens.push({ 'name': 'screenD', 'width': 250, 'height': 60 });
+session.screens.push({ 'name': 'screenE', 'width': 390, 'height': 120 });
+session.screens.push({ 'name': 'screenF', 'width': 1240, 'height': 650 });
+
+// Converting the JSON string with JSON.stringify()
+// then saving with localStorage in the name of session
+localStorage.setItem('session', JSON.stringify(session));
+
+// Example of how to transform the String generated through
+// JSON.stringify() and saved in localStorage in JSON object again
+var restoredSession = JSON.parse(localStorage.getItem('session'));
+
+// Now restoredSession variable contains the object that was saved
+// in localStorage
+console.log(restoredSession);
+</pre>
+
+<h2 id="명세">명세</h2>
+
+<table class="standard-table">
+ <tbody>
+ <tr>
+ <th scope="col">Specification</th>
+ <th scope="col">Status</th>
+ <th scope="col">Comment</th>
+ </tr>
+ <tr>
+ <td>{{SpecName('ES5.1', '#sec-15.12.3', 'JSON.stringify')}}</td>
+ <td>{{Spec2('ES5.1')}}</td>
+ <td>Initial definition. Implemented in JavaScript 1.7.</td>
+ </tr>
+ <tr>
+ <td>{{SpecName('ES6', '#sec-json.stringify', 'JSON.stringify')}}</td>
+ <td>{{Spec2('ES6')}}</td>
+ <td></td>
+ </tr>
+ <tr>
+ <td>{{SpecName('ESDraft', '#sec-json.stringify', 'JSON.stringify')}}</td>
+ <td>{{Spec2('ESDraft')}}</td>
+ <td></td>
+ </tr>
+ </tbody>
+</table>
+
+<h2 id="브라우저_호환성">브라우저 호환성</h2>
+
+<p>{{Compat("javascript.builtins.JSON.stringify")}}</p>
+
+<h2 id="같이_보기">같이 보기</h2>
+
+<ul>
+ <li>{{jsxref("JSON.parse()")}}</li>
+</ul>