TS

송은우·2022년 2월 17일
0

클래스 decoration의 경우, constructor을 건드릴 경우 무조건 super이 있어야 함.
object 속에 변수로 key 할당 하는 방법은 {[name]:val} 로 하는 방법이 있음

function logging(target: any, name: any, descriptor: any) {
  console.log(target, name);
  console.log(descriptor);
  const originMethod = descriptor.value;
  descriptor.value = function (...args: any[]) {
    //const res = originMethod.apply(this, args);
    console.log(this);
    console.log(`${name} method arguments: `, args);
    //console.log(`${name} method return: `, res);
    //return res;
  };
}
class Product {
  price: number = 1000;

  @logging
  setPrice(p: number) {
    this.price = p;
    console.log(this.price);
    return this.price;
  }
}

const p = new Product();
p.setPrice(1000);
p.setPrice(2000);

이 부분이 가장 기억에 남음. method descriptor 은 origin Method라는 것을 통해서 직접 접근하지 않을 시 원래 함수는 삭제됨.

접근자 데코레이터에는 제약이 있는데, 하나의 프로퍼티에 대한 get, set 메서드에 동일한 데코레이터가 적용될 수 없습니다. 원래 자바스크립트에서는 하나의 프로퍼티가 get, set 메서드를 둘 다 가질 수 있습니다.

타입스크립트 문서에서는 하나의 프로퍼티에 get, set 접근자가 모두 있고, 두 접근자에 동일한 데코레이터가 적용되었을 경우 소스코드 상에서 순서가 앞선 접근자에만 데코레이터가 적용된다고 나와있습니다. 이유는 접근자 데코레이터 또한 Property Descriptor에 적용되는데, 접근자의 Property Descriptor는 get, set 접근자를 모두 포함할 뿐 각 접근자에 대한 Property Descriptor가 없기 때문입니다.

https://haeguri.github.io/2019/08/25/typescript-decorator/#Decorator-Factory

profile
학생의 마음가짐으로 최선을 다하자

0개의 댓글