aboutsummaryrefslogtreecommitdiff
path: root/files/ko/web/api/formdata/index.html
blob: 212d19e6c29d1c4e422267100650499bc7a7195b (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
---
title: FormData
slug: Web/API/FormData
tags:
  - API
  - 인터페이스
  - 폼 데이터
translation_of: Web/API/FormData
---
<p>{{APIRef("XMLHttpRequest")}}</p>

<p><code><strong>FormData</strong></code><strong> </strong>인터페이스는 form 필드와 그 값을 나타내는 일련의 key/value 쌍을 쉽게 생성할 수 있는 방법을 제공합니다. 또한 {{domxref("XMLHttpRequest.send()")}} 메서드를 사용하여 쉽게 전송할 수 있습니다. 인코딩 타입이 <code>"multipart/form-data"</code>로 설정된 경우, form에서 사용하는 것과 동일한 포맷을 사용해야 합니다.</p>

<p>간단한 <code>GET</code> 전송을 사용하는 경우에는 {{HTMLElement("form")}} 이 수행하는 방식으로 쿼리 매개 변수를 생성할 수 있습니다. 이 경우 {{domxref("URLSearchParams")}} 생성자에 직접 전달할 수 있습니다.</p>

<p><code>FormData</code> 를 구현하는 객체는 {{domxref('FormData.entries()', 'entries()')}} 대신 {{jsxref("Statements/for...of", "for...of")}} 구조를 직접 사용할 수 있습니다. <code>for (var p of myFormData)</code> 는 <code>for (var p of myFormData.entries())</code> 와 같습니다.</p>

<div class="note">
<p><strong>주의</strong>: 이 기능은 <a href="/en-US/docs/Web/API/Web_Workers_API">Web Workers</a>에서도 사용할 수 있습니다.</p>
</div>

<h2 id="생성자">생성자</h2>

<dl>
 <dt>{{domxref("FormData.FormData","FormData()")}}</dt>
 <dd>새로운 <code>FormData</code> 객체를 생성합니다.</dd>
</dl>

<h2 id="메소드">메소드</h2>

<dl>
 <dt>{{domxref("FormData.append()")}}</dt>
 <dd>FormData 객체안에 이미 키가 존재하면 그 키에 새로운 값을 추가하고, 키가 없으면 추가합니다.</dd>
 <dt>{{domxref("FormData.delete()")}}</dt>
 <dd>FormData 객체로부터 키/밸류 쌍을 삭제합니다.</dd>
 <dt>{{domxref("FormData.entries()")}}</dt>
 <dd>이 객체에 담긴 모든 키/밸류 쌍을 순회할 수 있는 {{jsxref("Iteration_protocols","iterator")}}를 반환합니다.</dd>
 <dt>{{domxref("FormData.get()")}}</dt>
 <dd><code>FormData</code> 객체 내의 값들 중 주어진 키와 연관된 첫번째 값을 반환합니다.</dd>
 <dt>{{domxref("FormData.getAll()")}}</dt>
 <dd><code>FormData</code> 객체 내의 값들 중 주어진 키와 연관된 모든 값이 담긴 배열을 반환합니다.</dd>
 <dt>{{domxref("FormData.has()")}}</dt>
 <dd><code>FormData</code> 객체에 특정 키가 포함되어 있는지 여부를 나타내는 boolean 을 반환합니다.</dd>
 <dt>{{domxref("FormData.keys()")}}</dt>
 <dd>이 객체에 담긴 모든 키/벨류 쌍들의 모든 키들을 순회 할 수 있는 {{jsxref("Iteration_protocols", "iterator")}}를 반환합니다.</dd>
 <dt>{{domxref("FormData.set()")}}</dt>
 <dd><code>FormData</code> 객체 내에 있는 기존 키에 새 값을 설정하거나, 존재하지 않을 경우 키/밸류 쌍을 추가합니다.</dd>
 <dt>{{domxref("FormData.values()")}}</dt>
 <dd>이 객체에 포함된 모든 밸류를 통과하는 {{jsxref("Iteration_protocols", "iterator")}}를 반환합니다.</dd>
</dl>

<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('XMLHttpRequest','#interface-formdata','FormData')}}</td>
   <td>{{Spec2('XMLHttpRequest')}}</td>
   <td>FormData defined in XHR spec</td>
  </tr>
 </tbody>
</table>

<h2 id="브라우저_호환성">브라우저 호환성</h2>



<p>{{Compat("api.FormData")}}</p>

<h2 id="See_also">See also</h2>

<ul>
 <li>{{domxref("XMLHTTPRequest")}}</li>
 <li><a href="/ko/docs/Web/API/XMLHttpRequest/Using_XMLHttpRequest">Using XMLHttpRequest</a></li>
 <li><a href="/ko/docs/Web/API/FormData/Using_FormData_Objects">Using FormData objects</a></li>
 <li>{{HTMLElement("Form")}}</li>
</ul>