diff options
author | alattalatta <urty5656@gmail.com> | 2021-09-15 20:44:13 +0900 |
---|---|---|
committer | hochan Lee <hochan049@gmail.com> | 2021-10-11 20:39:44 +0900 |
commit | 4756692630cd877d81adf15147847ecb59e31edf (patch) | |
tree | 12dd93d0372a92f49d25fbb640170fa068837f31 /files/ko | |
parent | 4d58dfc2eb5d02147432750c356c4f5dd70d499c (diff) | |
download | translated-content-4756692630cd877d81adf15147847ecb59e31edf.tar.gz translated-content-4756692630cd877d81adf15147847ecb59e31edf.tar.bz2 translated-content-4756692630cd877d81adf15147847ecb59e31edf.zip |
Rewrite WeakMap
Diffstat (limited to 'files/ko')
-rw-r--r-- | files/ko/web/javascript/reference/global_objects/weakmap/index.md | 144 |
1 files changed, 70 insertions, 74 deletions
diff --git a/files/ko/web/javascript/reference/global_objects/weakmap/index.md b/files/ko/web/javascript/reference/global_objects/weakmap/index.md index bf70259dce..de5c26fba8 100644 --- a/files/ko/web/javascript/reference/global_objects/weakmap/index.md +++ b/files/ko/web/javascript/reference/global_objects/weakmap/index.md @@ -2,85 +2,84 @@ title: WeakMap slug: Web/JavaScript/Reference/Global_Objects/WeakMap tags: - - ECMAScript6 + - Class + - ECMAScript 2015 - JavaScript + - Reference - WeakMap -translation_of: Web/JavaScript/Reference/Global_Objects/WeakMap + - Polyfill browser-compat: javascript.builtins.WeakMap +translation_of: Web/JavaScript/Reference/Global_Objects/WeakMap --- -<div>{{JSRef}}</div> - -<p><strong><code>WeakMap</code></strong> 객체는 키가 약하게 참조되는 키/값 쌍의 컬렉션입니다. 키는 객체여야만 하나 값은 임의 값이 될 수 있습니다.</p> - -<h2 id="구문">구문</h2> +{{JSRef}} -<pre class="syntaxbox">new WeakMap([iterable]) -</pre> +**`WeakMap`** 객체는 키를 약하게 참조하는 키/값 쌍 컬렉션입니다. 키는 객체여야 하지만 값으로는 아무 값이나 사용할 수 있습니다. -<h3 id="매개변수">매개변수</h3> +## 설명 -<dl> - <dt><code>iterable</code></dt> - <dd>iterable은 배열 또는 요소가 키-값 쌍(2-요소 배열)인 다른 iterable 객체입니다. 각 키-값 쌍은 새로운 WeakMap에 추가됩니다. null은 undefined로 취급됩니다.</dd> -</dl> +`WeakMap`은 키로 오직 `Object` 타입만 사용할 수 있습니다. {{jsxref("Symbol")}}과 같은 {{Glossary("Primitive", "원시 값")}}은 `WeakMap`의 키로 사용할 수 없습니다. -<h2 id="설명">설명</h2> +### 'Weak'Map인 이유 -<p>WeakMap의 키는 오직 <code>Object</code>형뿐입니다. 키로 {{Glossary("Primitive", "원시 데이터형")}}은 허용되지 않습니다(가령 {{jsxref("Symbol")}}은 <code>WeakMap</code> 키가 될 수 없습니다).</p> +JavaScript의 맵 API는 키 배열 하나, 값 배열 하나 총 두 개의 배열과 네 개의 API 메서드로 구현해볼 수 있습니다. 이 '유사' 맵에 요소를 추가하는 것은 키와 값을 각 배열의 끝에 동시에 추가해서 수행할 수 있습니다. 그 결과로, 서로 연관된 키와 값이 배열 내에서 차지하는 인덱스가 서로 일치할 것입니다. 유사 맵에서 값을 가져오는 것은 키 배열을 순회해 일치하는 키를 찾고, 그 키의 인덱스를 사용해 값 배열에서 일치하는 값을 회수하는 것으로 해낼 수 있습니다. -<p>WeakMap 내 키는 약하게 유지됩니다. 이게 뜻하는 바는, 다른 강한 키 참조가 없는 경우, 그러면 모든 항목은 가비지 컬렉터에 의해 WeakMap에서 제거됩니다.</p> +이와 같은 구현에는 두 가지 중요한 문제가 있습니다. -<h3 id="왜_WeakMap인가요">왜 <em>Weak</em>Map인가요?</h3> +1. 요소 설정과 탐색이 *O(n)* (*n*은 맵의 키 수)입니다. 두 작업 모두 키 배열을 순회해서 맞는 키를 찾아야 하기 때문입니다. +2. 메모리 누수가 발생할 수 있습니다. 두 배열로 인해 각각의 키와 값에 대한 참조가 무한히 유지되기 때문입니다. 따라서 키를 참조하는 곳이 아무데도 없어도, 배열의 참조로 인해 키가 가비지 컬렉션의 대상이 되지 않습니다. 이는 값 배열 역시 마찬가지입니다. -<p>숙련된 JavaScript 프로그래머는 이 API는 네 API 메서드에 의해 공유되는 두 배열(키에 하나, 값에 하나)로 JavaScript에서 구현될 수 있음을 알 수 있습니다. 이러한 구현은 주로 두 가지가 불편했을 겁니다. 첫 번째는 O(n) 검색(n은 map 내 키 개수)입니다. 두 번째는 메모리 누수 문제입니다. 수동으로 작성된 map이면, 키 배열은 키 객체 참조를 유지하려고 합니다, 가비지 컬렉트되는 것을 방지하는. 원래 WeakMap에서는, 키 객체 참조는 "약하게" 유지되고, 이는 다른 객체 참조가 없는 경우 가비지 컬렉션을 막지 않음을 뜻합니다.</p> +반면, 내장 `WeakMap`은 키 객체의 "약한" 참조만 가지고 있습니다. 따라서 내장 `WeakMap`은 가비지 컬렉션을 방지하지 않으며, 가비지 컬렉션 시 키 참조 역시 사라집니다. 맵 내의 값 역시 "약한" 참조로서 가비지 컬렉션을 막지 않습니다. `WeakMap`은 **키가 가비지 컬렉션 되지 않았을 때만** 가치가 있는 정보를 키와 연결할 때 특히 유용한 구조입니다. -<p>약한 참조로 인해, <code>WeakMap</code> 키는 열거불가입니다(즉 키 목록을 제공하는 메서드가 없습니다). 키가 있다면, 그 목록은 가비지 콜렉션 상태에 달려있습니다, 비결정성(non-determinism, 크기를 결정할 수 없는)을 도입하는. 키 목록을 원하는 경우, {{jsxref("Map")}}을 사용해야 합니다.</p> +**약한 참조로 인해 `WeakMap`의 키는 열거할 수 없습니다.** 키 목록을 가져오는 메서드는 존재하지 않습니다. 그런 메서드가 존재한다면 그 구현은 가비지 컬렉션 상태에 의존하게 되므로 비결정적인 결과를 낳게 됩니다. 키의 목록이 필요하면 {{jsxref("Map")}}을 사용하세요. -<h2 id="속성">속성</h2> +## 생성자 -<dl> - <dt><code>WeakMap.length</code></dt> - <dd><code>length</code> 속성값은 0.</dd> - <dt>{{jsxref("WeakMap.prototype")}}</dt> - <dd><code>WeakMap</code> 생성자에 대한 프로토타입을 나타냅니다. 모든 <code>WeakMap</code> 객체에 속성을 추가할 수 있습니다.</dd> -</dl> +- {{jsxref("WeakMap/WeakMap", "WeakMap()")}} + - : 새로운 `WeakMap` 객체를 생성합니다. -<h2 id="WeakMap_인스턴스"><code>WeakMap</code> 인스턴스</h2> +## 속성 -<p>모든 <code>WeakMap</code> 인스턴스는 {{jsxref("WeakMap.prototype")}}에서 상속합니다.</p> +- `WeakMap.length` + - : `length` 속성값은 0. +- {{jsxref("WeakMap.prototype")}} + - : `WeakMap` 생성자에 대한 프로토타입을 나타냅니다. 모든 `WeakMap` 객체에 속성을 추가할 수 있습니다. -<h3 id="속성_2">속성</h3> +## 인스턴스 메서드 -<p>{{page('ko/docs/Web/JavaScript/Reference/Global_Objects/WeakMap/prototype','속성')}}</p> +- {{jsxref("WeakMap.delete", "WeakMap.prototype.delete(key)")}} + - : `key`에 연결된 값을 제거합니다. 이후의 `WeakMap.prototype.has(key)`는 `false`를 반환할 것입니다. +- {{jsxref("WeakMap.get", "WeakMap.prototype.get(key)")}} + - : `key`에 연결된 값을 반환합니다. 그런 값이 없으면 {{jsxref("undefined")}}를 반환합니다. +- {{jsxref("WeakMap.has", "WeakMap.prototype.has(key)")}} + - : `key`에 연결된 값이 `WeakMap` 객체에 존재하는지 나타내는 불리언 값을 반환합니다. +- {{jsxref("WeakMap.set", "WeakMap.prototype.set(key, value)")}} + - : `WeakMap` 객체의 `key`에 `value`를 연결합니다. `WeakMap` 객체를 반환합니다. -<h3 id="메서드">메서드</h3> +## 예제 -<p>{{page('ko/docs/Web/JavaScript/Reference/Global_Objects/WeakMap/prototype','메서드')}}</p> +### `WeakMap` 사용하기 -<h2 id="예">예</h2> - -<h3 id="WeakMap_사용"><code>WeakMap</code> 사용</h3> - -<pre class="brush: js">var wm1 = new WeakMap(), - wm2 = new WeakMap(), - wm3 = new WeakMap(); -var o1 = {}, - o2 = function(){}, - o3 = window; +```js +const wm1 = new WeakMap(), + wm2 = new WeakMap(), + wm3 = new WeakMap(); +const o1 = {}, + o2 = function() {}, + o3 = window; wm1.set(o1, 37); -wm1.set(o2, "azerty"); -wm2.set(o1, o2); // 값은 무엇이든 될 수 있음, 객체 또는 함수 포함 +wm1.set(o2, 'azerty'); +wm2.set(o1, o2); // 값은 함수와 객체를 포함해 아무거나 가능 wm2.set(o3, undefined); -wm2.set(wm1, wm2); // 키와 값은 어떤 객체든 될 수 있음. 심지어 WeakMap도! +wm2.set(wm1, wm2); // 키는 아무 객체나 가능. 다른 WeakMap도 가능합니다! wm1.get(o2); // "azerty" -wm2.get(o2); // undefined, wm2에 o2에 대한 키가 없기에 -wm2.get(o3); // undefined, 이게 설정값이기에 +wm2.get(o2); // undefined, wm2에는 o2에 연결된 값이 없음 +wm2.get(o3); // undefined, o3에 undefined를 연결함 wm1.has(o2); // true wm2.has(o2); // false -wm2.has(o3); // true (값 자체가 'undefined'이더라도) +wm2.has(o3); // true (값이 undefined지만) wm3.set(o1, 37); wm3.get(o1); // 37 @@ -88,49 +87,46 @@ wm3.get(o1); // 37 wm1.has(o1); // true wm1.delete(o1); wm1.has(o1); // false -</pre> - -<h3 id=".clear()_메서드로_WeakMap_같은_클래스_구현">.clear() 메서드로 <code>WeakMap</code> 같은 클래스 구현</h3> +``` -<p>설명을 위해, 다음 예는 새로운 ECMAScript 6 <code>class</code> 구조를 사용합니다, 현재 널리 구현되지 않은.</p> +### .clear() 메서드를 추가한 `WeakMap`류 클래스 구현 -<pre class="brush: js">class ClearableWeakMap { +```js +class ClearableWeakMap { constructor(init) { - this._wm = new WeakMap(init) + this._wm = new WeakMap(init); } clear() { - this._wm = new WeakMap() + this._wm = new WeakMap(); } delete(k) { - return this._wm.delete(k) + return this._wm.delete(k); } get(k) { - return this._wm.get(k) + return this._wm.get(k); } has(k) { - return this._wm.has(k) + return this._wm.has(k); } set(k, v) { - this._wm.set(k, v) - return this + this._wm.set(k, v); + return this; } } -</pre> +``` -<h2 id="specifications">명세</h2> +## 명세 -<p>{{Specifications}}</p> +{{Specifications}} -<h2 id="browser_compatibility">브라우저 호환성</h2> +## 브라우저 호환성 -<p>{{Compat}}</p> +{{Compat}} -<h2 id="참조">참조</h2> +## 참조 -<ul> - <li><a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=547941">Mozilla에서 WeakMap 버그</a></li> - <li><a href="http://fitzgeraldnick.com/weblog/53/">ECMAScript 6 WeakMap으로 구현 정보 은닉</a></li> - <li>{{jsxref("Map")}}</li> - <li>{{jsxref("Set")}}</li> - <li>{{jsxref("WeakSet")}}</li> -</ul> +- [`core-js`의 `WeakMap` 폴리필](https://github.com/zloirock/core-js#weakmap) +- [JavaScript 안내서의 `WeakMap`](/ko/docs/Web/JavaScript/Guide/Keyed_collections#weakmap_object) +- {{jsxref("Map")}} +- {{jsxref("Set")}} +- {{jsxref("WeakSet")}} |