기술나눔

es6의 프록시는 관찰자 모드를 구현합니다.

2024-07-08

한어Русский языкEnglishFrançaisIndonesianSanskrit日本語DeutschPortuguêsΕλληνικάespañolItalianoSuomalainenLatina

프록시 소개

ES6의 프록시는 프록시 객체를 생성하는 데 사용되는 특수 객체입니다. 이를 통해 객체의 기본 동작을 가로채고 수정하는 등의 사용자 정의 동작을 정의할 수 있습니다. 프록시는 속성 액세스, 할당, 함수 호출 등을 포함하여 객체에 대한 다양한 작업을 가로채는 데 사용될 수 있습니다.

Proxy의 기능은 대상 개체 이전에 차단 계층을 설정하는 것입니다. 이를 통해 대상 개체에 대한 다양한 작업을 가로채고 사용자 정의할 수 있습니다. Proxy를 사용하면 대상 객체의 접근 제어, 데이터 검증, 속성 하이재킹 등의 기능을 구현할 수 있습니다.

프록시는 대상 개체를 프록시 개체로 래핑하고 프록시 개체에서 작동할 수 있는 일련의 후크 기능("트랩"이라고도 함)을 제공합니다. 프록시 객체에 대해 작업할 때 실제로 이러한 후크 함수를 호출하고 필요에 따라 그에 따라 처리합니다.

프록시 속성 작업 소개

  • get(target, propKey, Receiver): 객체 속성 읽기 가로채기
  • set(target, propKey, value, receive): 객체 속성 설정을 가로채서 부울 값을 반환합니다.
  • has(target, propKey): 프록시에서 propKey의 작업을 가로채서 부울 값을 반환합니다.
  • deleteProperty(target, propKey): 프록시 삭제[propKey] 작업을 가로채고 부울 값을 반환합니다.
  • ownKeys(target): Object.getOwnPropertyNames(proxy), Object.getOwnPropertySymbols(proxy), Object.keys(proxy), for...in 루프를 가로채서 배열을 반환합니다. 이 메소드는 모든 대상 객체 자체 속성의 속성 이름을 반환하는 반면, Object.keys()의 반환 결과에는 대상 객체의 자체 탐색 가능한 속성만 포함됩니다.
  • getOwnPropertyDescriptor(target, propKey): Object.getOwnPropertyDescriptor(proxy, propKey)를 가로채고 속성의 설명 개체를 반환합니다.
  • DefineProperty(target, propKey, propDesc): Object.defineProperty(proxy, propKey, propDesc), Object.defineProperties(proxy, propDescs)를 가로채서 부울 값을 반환합니다.
  • PreventExtensions(target): Object.preventExtensions(proxy)를 가로채고 부울 값을 반환합니다.
  • getPrototypeOf(target): Object.getPrototypeOf(proxy)를 가로채서 객체를 반환합니다.
  • isExtensible(target): Object.isExtensible(proxy)을 가로채서 부울 값을 반환합니다.
  • setPrototypeOf(target, proto): Object.setPrototypeOf(proxy, proto)를 가로채고 부울 값을 반환합니다. 대상 개체가 함수인 경우 가로챌 수 있는 두 가지 추가 작업이 있습니다.
  • apply(target, object, args): Proxy(...args), Proxy.call(object, ...args), Proxy.apply(...)와 같은 함수 호출로 Proxy 인스턴스의 작업을 가로챕니다.
  • constructor(target, args): 새 프록시(...args)와 같은 생성자 호출로 Proxy 인스턴스의 작업을 가로챕니다.

사용Proxy관찰자 패턴 구현