diff options
Diffstat (limited to 'files/ko/web/api/urlsearchparams')
-rw-r--r-- | files/ko/web/api/urlsearchparams/index.html | 136 | ||||
-rw-r--r-- | files/ko/web/api/urlsearchparams/tostring/index.html | 78 | ||||
-rw-r--r-- | files/ko/web/api/urlsearchparams/urlsearchparams/index.html | 76 |
3 files changed, 290 insertions, 0 deletions
diff --git a/files/ko/web/api/urlsearchparams/index.html b/files/ko/web/api/urlsearchparams/index.html new file mode 100644 index 0000000000..5491ad0b6f --- /dev/null +++ b/files/ko/web/api/urlsearchparams/index.html @@ -0,0 +1,136 @@ +--- +title: URLSearchParams +slug: Web/API/URLSearchParams +tags: + - API + - Interface + - Reference + - URL API + - URLSearchParams +translation_of: Web/API/URLSearchParams +--- +<div>{{ApiRef("URL API")}}</div> + +<p><strong><code>URLSearchParams</code></strong> 인터페이스는 URL의 쿼리 문자열에 대해 작업할 수 있는 유틸리티 메서드를 정의합니다.</p> + +<p><code>URLSearchParams</code>를 구현하는 객체는 {{jsxref("Statements/for...of", "for...of")}} 반복문에 바로 사용할 수 있습니다.</p> + +<pre class="brush: js">for (const [key, value] of mySearchParams) {} +for (const [key, value] of mySearchParams.entries()) {} +</pre> + +<p>{{availableinworkers}}</p> + +<h2 id="생성자">생성자</h2> + +<dl> + <dt>{{domxref("URLSearchParams.URLSearchParams", 'URLSearchParams()')}}</dt> + <dd> <code>URLSearchParams</code> 객체 인스턴스를 반환합니다.</dd> +</dl> + +<h2 id="메서드">메서드</h2> + +<dl> + <dt>{{domxref("URLSearchParams.append()")}}</dt> + <dd>특정 키/값을 새로운 검색 매개변수로 추가합니다.</dd> + <dt>{{domxref("URLSearchParams.delete()")}}</dt> + <dd>특정 매개변수를 찾아 키와 값 모두 지웁니다.</dd> + <dt>{{domxref("URLSearchParams.entries()")}}</dt> + <dd>객체의 모든 키/값 쌍을 순회할 수 있는 {{jsxref("Iteration_protocols","순회기")}}를 반환합니다.</dd> + <dt>{{domxref("URLSearchParams.forEach()")}}</dt> + <dd>객체의 모든 값을 순회하며 지정한 콜백을 호출합니다.</dd> + <dt>{{domxref("URLSearchParams.get()")}}</dt> + <dd>주어진 검색 매개변수에 연결된 첫 번째 값을 반환합니다.</dd> + <dt>{{domxref("URLSearchParams.getAll()")}}</dt> + <dd>주어진 검색 매개변수에 연결된 모든 값을 반환합니다.</dd> + <dt>{{domxref("URLSearchParams.has()")}}</dt> + <dd>주어진 검색 매개변수의 존재 여부를 나타내는 {{jsxref("Boolean")}}을 반환합니다.</dd> + <dt>{{domxref("URLSearchParams.keys()")}}</dt> + <dd>객체의 <strong>모든 키</strong>를 순회할 수 있는 {{jsxref("Iteration_protocols", "순회기")}}를 반환합니다.</dd> + <dt>{{domxref("URLSearchParams.set()")}}</dt> + <dd>주어진 검색 매개변수에 연결된 값을 설정합니다. 연결된 값이 다수라면 나머지는 제거합니다.</dd> + <dt>{{domxref("URLSearchParams.sort()")}}</dt> + <dd>모든 키/값 쌍을 키로 정렬합니다.</dd> + <dt>{{domxref("URLSearchParams.toString()")}}</dt> + <dd>URL에 쓰기 적합한 형태의 쿼리 문자열을 반환합니다.</dd> + <dt>{{domxref("URLSearchParams.values()")}}</dt> + <dd>객체의 <strong>모든 값</strong>을 순회할 수 있는 {{jsxref("Iteration_protocols", "순회기")}}를 반환합니다.</dd> +</dl> + +<h2 id="예제">예제</h2> + +<pre class="brush: js">var paramsString = "q=URLUtils.searchParams&topic=api"; +var searchParams = new URLSearchParams(paramsString); + +//Iterate the search parameters. +for (let p of searchParams) { + console.log(p); +} + +searchParams.has("topic") === true; // true +searchParams.get("topic") === "api"; // true +searchParams.getAll("topic"); // ["api"] +searchParams.get("foo") === null; // true +searchParams.append("topic", "webdev"); +searchParams.toString(); // "q=URLUtils.searchParams&topic=api&topic=webdev" +searchParams.set("topic", "More webdev"); +searchParams.toString(); // "q=URLUtils.searchParams&topic=More+webdev" +searchParams.delete("topic"); +searchParams.toString(); // "q=URLUtils.searchParams" +</pre> + +<h3 id="주의점">주의점</h3> + +<p><code>URLSearchParams</code> 생성자는 전체 URL을 분석하지 않습니다. 그러나, 맨 앞의 <code>?</code>는 제거합니다.</p> + +<pre>var paramsString1 = "http://example.com/search?query=%40"; +var searchParams1 = new URLSearchParams(paramsString1); + +searchParams1.has("query"); // false +searchParams1.has("http://example.com/search?query"); // true + +searchParams1.get("query"); // null +searchParams1.get("http://example.com/search?query"); // "@" (equivalent to decodeURIComponent('%40')) + +var paramsString2 = "?query=value"; +var searchParams2 = new URLSearchParams(paramsString2); +searchParams2.has("query"); // true + +var url = new URL("http://example.com/search?query=%40"); +var searchParams3 = new URLSearchParams(url.search); +searchParams3.has("query") // true</pre> + +<h2 id="명세">명세</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">명세</th> + <th scope="col">상태</th> + <th scope="col">비고</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('URL', '#urlsearchparams', "URLSearchParams")}}</td> + <td>{{Spec2('URL')}}</td> + <td>Initial definition.</td> + </tr> + </tbody> +</table> + +<h2 id="브라우저_호환성">브라우저 호환성</h2> + + + +<p>{{Compat("api.URLSearchParams")}}</p> + +<h2 id="같이_보기">같이 보기</h2> + +<ul> + <li>{{domxref("URL")}} 인터페이스.</li> + <li><a href="https://developers.google.com/web/updates/2016/01/urlsearchparams?hl=en">Google Developers: Easy URL manipulation with URLSearchParams</a></li> +</ul> + +<dl> +</dl> diff --git a/files/ko/web/api/urlsearchparams/tostring/index.html b/files/ko/web/api/urlsearchparams/tostring/index.html new file mode 100644 index 0000000000..45f0373dec --- /dev/null +++ b/files/ko/web/api/urlsearchparams/tostring/index.html @@ -0,0 +1,78 @@ +--- +title: URLSearchParams.toString() +slug: Web/API/URLSearchParams/toString +translation_of: Web/API/URLSearchParams/toString +--- +<p>{{ApiRef("URL API")}}</p> + +<p><strong><code>toString()</code> </strong>은 {{domxref("URLSearchParams")}} 인터페이스의 메소드로서, URL에서 사용할 수 있는 쿼리 문자열을 리턴합니다.</p> + +<div class="blockIndicator note"> +<p><strong>Note</strong>: 이 메소드는 물음표가 없는 쿼리 문자열을 리턴합니다. 이는 물음표를 포함하여 리턴하는 <a href="https://developer.mozilla.org/en-US/docs/Web/API/HTMLHyperlinkElementUtils/search">window.location.search</a>와는 다른 부분입니다.</p> +</div> + +<p>{{availableinworkers}}</p> + +<h2 id="Syntax">Syntax</h2> + +<pre class="syntaxbox">URLSearchParams.toString()</pre> + +<h3 id="Parameters">Parameters</h3> + +<p>None.</p> + +<h3 id="Return_value">Return value</h3> + +<p>A {{domxref("DOMString")}}, without the question mark.</p> + +<h2 id="Examples">Examples</h2> + +<pre class="brush: js">let url = new URL('https://example.com?foo=1&bar=2'); +let params = new URLSearchParams(url.search.slice(1)); + +//두번째 foo 파라미터를 추가합니다. +params.append('foo', 4); +console.log(params.toString()); +//'foo=1&bar=2&foo=4'를 출력합니다. + +// note: params can also be directly created +let url = new URL('https://example.com?foo=1&bar=2'); +let params = url.searchParams; + +// or even simpler +let params = new URLSearchParams('foo=1&bar=2'); +</pre> + +<h2 id="Specifications">Specifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + <th scope="col">Comment</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('URL', '#interface-urlsearchparams', "toString() (see \"stringifier\")")}}</td> + <td>{{Spec2('URL')}}</td> + <td>Initial definition.</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility">Browser compatibility</h2> + +<div> + + +<p>{{Compat("api.URLSearchParams.toString")}}</p> +</div> + +<h2 id="See_also">See also</h2> + +<ul> + <li>The {{domxref("URL")}} interface.</li> + <li><a href="https://developers.google.com/web/updates/2016/01/urlsearchparams?hl=en">Google Developers: Easy URL manipulation with URLSearchParams</a></li> +</ul> diff --git a/files/ko/web/api/urlsearchparams/urlsearchparams/index.html b/files/ko/web/api/urlsearchparams/urlsearchparams/index.html new file mode 100644 index 0000000000..94f138a633 --- /dev/null +++ b/files/ko/web/api/urlsearchparams/urlsearchparams/index.html @@ -0,0 +1,76 @@ +--- +title: URLSearchParams() +slug: Web/API/URLSearchParams/URLSearchParams +translation_of: Web/API/URLSearchParams/URLSearchParams +--- +<p>{{ApiRef("URL API")}}</p> + +<p><code><strong>URLSearchParams()</strong></code> 생성자는 새로운 {{domxref("URLSearchParams")}} 객체를 생성하고 반환합니다.</p> + +<p>{{availableinworkers}}</p> + +<h2 id="구문">구문</h2> + +<pre class="syntaxbox notranslate">var <em>URLSearchParams</em> = new URLSearchParams(<em>init</em>);</pre> + +<h3 id="매개변수">매개변수</h3> + +<p><em><code>init</code></em> {{optional_inline}}</p> + +<p>다음 중 하나:</p> + +<ul> + <li>{{domxref("USVString")}}은 <code>application/x-www-form-urlencoded</code> 형식에서 해석됩니다. 선행문자인 <code>'?'</code> 는 무시됩니다.</li> + <li>일련의 {{domxref("USVString")}} 쌍은, 이름/값(names/values)을 나타냅니다.</li> + <li>{{domxref("USVString")}}은 키(keys)와 속성(values)의 레코드입니다.</li> +</ul> + +<h3 id="반환값">반환값</h3> + +<p>{{domxref("URLSearchParams")}} 객체 인스턴스</p> + +<h2 id="예제">예제</h2> + +<p>다음 예제는 URL string으로부터 {{domxref("URLSearchParams")}} 객체가 어떻게 만들어지는지를 보여줍니다.</p> + +<pre class="brush: js notranslate">// url 생성자에 전달된 주소를 url.search를 통해 params라는 변수로 검색합니다. +var url = new URL('https://example.com?foo=1&bar=2'); +var params = new URLSearchParams(url.search); + +// 문자열 리터럴을 전달합니다. +var params2 = new URLSearchParams("foo=1&bar=2"); +var params2a = new URLSearchParams("?foo=1&bar=2"); + +// 일련의 쌍으로 전달합니다. +var params3 = new URLSearchParams([["foo", "1"], ["bar", "2"]]); + +// 레코드로 전달합니다. +var params4 = new URLSearchParams({"foo": "1", "bar": "2"}); +</pre> + +<h2 id="사양">사양</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">명세</th> + <th scope="col">상태</th> + <th scope="col">비고</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('URL', '#dom-urlsearchparams-urlsearchparams', "URLSearchParams()")}}</td> + <td>{{Spec2('URL')}}</td> + <td>Initial definition.</td> + </tr> + </tbody> +</table> + +<h2 id="브라우저_호환성">브라우저 호환성</h2> + +<div> + + +<p>{{Compat("api.URLSearchParams.URLSearchParams")}}</p> +</div> |