정보실

웹학교

정보실

javascript 자바 스크립트 프록시 객체

본문

객체로 작업 할 때 기존 객체의 동작을 가로 채서 변경하는 프록시 객체를 만들 수 있습니다.


https://flaviocopes.com/javascript-proxy-objects/ 


ES2015에 도입 된 프록시 기본 개체를 사용합니다.


car 객체가 있다고 가정 해보십시오


const car = {
  color: 'blue'
}


우리가 만들 수 있는 매우 간단한 예는 존재하지 않는 속성에 액세스하려고 할 때 '찾을 수 없음'문자열을 반환하는 것입니다.


이 객체의 속성에 액세스하려고 할 때마다 호출되는 프록시를 정의 할 수 있습니다.


get() 메서드가 있는 다른 객체를 만들어 대상 객체와 속성을 매개 변수로 받습니다.


const car = {
  color: 'blue'
}

const handler = {
  get(target, property) {
    return target[property] ?? 'Not found'
  }
}


이제 new Proxy()를 호출하고 원본 객체와 핸들러를 전달하여 프록시 객체를 초기화 할 수 있습니다.


const proxyObject = new Proxy(car, handler)


이제 car 객체에 포함 된 속성에 액세스하지만 proxyObject에서 이를 참조하십시오.


proxyObject.color //'blue'


이것은 car.color를 호출하는 것과 같습니다.


그러나 car.test와 같이 자동차에 존재하지 않는 속성에 액세스 하려고 하면 정의되지 않은 상태로 돌아옵니다. 프록시를 사용하면 '찾을 수 없음'문자열이 다시 표시됩니다.


proxyObject.test //'Not found'


프록시 핸들러의 get() 메소드로 제한되지 않습니다. 그것은 우리가 쓸 수 있는 가장 간단한 예일 뿐입니다.


사용할 수 있는 다른 방법이 있습니다.


  • apply 객체에서 apply()를 사용할 때 호출됩니다.
  • construct 객체 생성자에 액세스 할 때 호출됩니다
  • deleteProperty는 속성을 삭제하려고 할 때 실행됩니다
  • defineProperty는 객체에 새로운 속성을 정의 할 때 호출됩니다
  • set 속성을 설정하려고 할 때 실행됩니다

등등. 기본적으로 객체에서 발생하는 모든 것을 제어하고 자체 규칙을 구현하기 위한 추가 규칙 및 제어를 제공하는 보호 게이트를 만들 수 있습니다.


사용할 수 있는 다른 방법 (트랩이라고도 함)은 다음과 같습니다.


  • enumerate
  • getOwnPropertyDescriptor
  • getPrototypeOf
  • has
  • isExtensible
  • ownKeys
  • preventExtensions
  • setPrototypeOf

모두 해당 기능에 해당합니다.


MDN에 있는 각각에 대해 더 읽을 수 있습니다.


deleteProperty를 사용하여 다른 예를 만들어 봅시다. 우리는 객체의 속성을 삭제하지 않기를 원합니다.


const car = {
  color: 'blue'
}

const handler = {
  deleteProperty(target, property) {
    return false
  }
}

const proxyObject = new Proxy(car, handler)


delete proxyObject.color를 호출하면 TypeError가 발생합니다.


TypeError: 'deleteProperty' on proxy: trap returned falsish for property 'color'

물론 car 객체에서 항상 속성을 직접 삭제할 수는 있지만 객체를 액세스 할 수 없고 프록시 만 노출하도록 로직을 작성하는 경우 로직을 캡슐화 하는 방법입니다.



페이지 정보

조회 24회 ]  작성일20-06-24 12:31

웹학교