From 1af1904f078451fe341c7012bf157969bb1cfca8 Mon Sep 17 00:00:00 2001 From: Koeun Lee <58801242+korany-lee@users.noreply.github.com> Date: Tue, 1 Mar 2022 01:27:44 +0900 Subject: update proxy MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 띄어쓰기 수정 - 페이지 링크가 확실하지 않은 부분 수정 - en-us를 기준으로 code 부분 수정 - en-us를 기준으로 해당되지 않는 부분 제거 --- .../reference/global_objects/proxy/index.html | 26 +++++++++------------- 1 file changed, 10 insertions(+), 16 deletions(-) (limited to 'files/ko/web') diff --git a/files/ko/web/javascript/reference/global_objects/proxy/index.html b/files/ko/web/javascript/reference/global_objects/proxy/index.html index 777b4648d0..1189d39bc6 100644 --- a/files/ko/web/javascript/reference/global_objects/proxy/index.html +++ b/files/ko/web/javascript/reference/global_objects/proxy/index.html @@ -20,7 +20,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Proxy
traps
프로퍼티에 접근할 수 있는 메소드. 운영체제에서 trap 이라는 컨셉과 유사하다.
target
-
proxy가 가상화하는 실제 객체. 이것은 proxy를 위한  backend 저장소로 사용된다.   Invariants (semantics that remain unchanged) regarding object non-extensibility or non-configurable properties are verified against the target.
+
proxy가 가상화하는 실제 객체. 이것은 proxy를 위한  backend 저장소로 사용된다. Invariants (semantics that remain unchanged) regarding object non-extensibility or non-configurable properties are verified against the target.

구문

@@ -32,9 +32,9 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Proxy
target
-
proxy와 함께 감싸진 target  객체 (native array, function, 다른 proxy을 포함한 객체)
+
proxy와 함께 감싸진 target 객체 (native array, function, 다른 proxy을 포함한 객체)
handler
-
프로퍼티들이 function 인  객체이다. 동작이 수행될 때, handler는 proxy의 행동을 정의한다.
+
프로퍼티들이 function인 객체이다. 동작이 수행될 때, handler는 proxy의 행동을 정의한다.

메서드

@@ -44,17 +44,11 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Proxy
폐기할 수 있는(revocable) Proxy 객체를 생성.
-

Methods of the handler object

- -

handler객체는 Proxy를 위한 trap들을 포함하고 있는 placeholder 객체이다.

- -
{{page('/en-US/docs/Web/JavaScript/Reference/Global_Objects/Proxy/handler', 'Methods') }}
-

예제

Basic example

-

프로퍼티 이름이 객체에 없을때, 기본값을 숫자 37로 리턴받는 간단한 예제이다. 이것은 get handler 를 사용하였다. 

+

프로퍼티 이름이 객체에 없을때, 기본값을 숫자 37로 리턴받는 간단한 예제이다. 이것은 get handler를 사용하였다.

var handler = {
     get: function(target, name){
@@ -86,7 +80,7 @@ console.log(target.a); // 37. 동작이 제대로 전달됨
 
 

Validation (검증)

-

Proxy에서, 객체에 전달된 값을 쉽게 검증할 수 있다. 이 예제는 set handler 를 사용하였다.

+

Proxy에서, 객체에 전달된 값을 쉽게 검증할 수 있다. 이 예제는 set handler를 사용하였다.

let validator = {
   set: function(obj, prop, value) {
@@ -114,7 +108,7 @@ person.age = 300; // Throws an exception
 
 

Extending constructor (생성자 확장)

-

function proxy는 쉽게 새로운 생성자와 함께 생성자를 확장할 수 있다. 이 예제에서는 construct 와 apply handlers 를 사용하였다.

+

function proxy는 쉽게 새로운 생성자와 함께 생성자를 확장할 수 있다. 이 예제에서는 constructapply handlers를 사용하였다.

function extend(sup,base) {
   var descriptor = Object.getOwnPropertyDescriptor(
@@ -155,7 +149,7 @@ console.log(Peter.age);  // 13

Manipulating DOM nodes (DOM nodes 조작)

-

가끔씩, 두 개의 다른 element의 속성이나 클래스 이름을 바꾸고 싶을 것이다. 아래는 set handler 를 사용하였다.

+

가끔씩, 두 개의 다른 element의 속성이나 클래스 이름을 바꾸고 싶을 것이다. 아래는 set handler를 사용하였다.

let view = new Proxy({
   selected: null
@@ -188,7 +182,7 @@ console.log(i2.getAttribute('aria-selected')); // 'true'
 
 

Value correction and an extra property (값 정정과 추가적인 property)

-

products 라는 proxy 객체는 전달된 값을 평가하고, 필요할 때 배열로 변환한다. 이 객체는 latestBrowser 라는 추가적인 property를 지원하는데, getter와 setter 모두 지원한다. 

+

products라는 proxy 객체는 전달된 값을 평가하고, 필요할 때 배열로 변환한다. 이 객체는 latestBrowser라는 추가적인 property를 지원하는데, getter와 setter 모두 지원한다.

let products = new Proxy({
   browsers: ['Internet Explorer', 'Netscape']
@@ -231,7 +225,7 @@ console.log(products.latestBrowser); // 'Chrome'
 
 

Finding an array item object by its property (property로 배열의 객체를 찾기)

-

proxy 는 유용한 특성을 가진 배열로 확장할 것이다. Object.defineProperties를 사용하지 않고, 유연하게 property들을 유연하게 "정의"할 수 있다. 이 예제는 테이블의 cell을 이용해서 row(열)을 찾는데 적용할 수 있다. 이 경우, target은 table.rows가 될 것이다.

+

proxy 는 유용한 특성을 가진 배열로 확장할 것이다. Object.defineProperties를 사용하지 않고, 유연하게 property들을 유연하게 "정의"할 수 있다. 이 예제는 테이블의 cell을 이용해서 row(열)을 찾는데 적용할 수 있다. 이 경우, target은 table.rows가 될 것이다.

let products = new Proxy([
   { name: 'Firefox', type: 'browser' },
@@ -292,7 +286,7 @@ console.log(products.number); // 3
 
 

A complete traps list example (완벽한 traps 리스트 예제)

-

이제 완벽한 traps 리스트를 생성하기 위해서, non native 객체를 프록시화 할 것이다. 이것은 특히, 다음과 같은 동작에 적합하다 : the "little framework" published on the document.cookie page 에 의해 생성된 docCookies 는 글로벌 객체

+

이제 완벽한 traps 리스트를 생성하기 위해서, 이러한 유형의 작업에 특히 적합한 non native 객체를 프록시화 할 것이다. [a simple cookie framework](https://reference.codeproject.com/dom/document/cookie/simple_document.cookie_framework)에 의해 생성된 전역 객체 docCookies이다.

/*
   var docCookies = ... get the "docCookies" object here:
-- 
cgit v1.2.3-54-g00ecf