@Decorators

Jung taeWoong·2021년 7월 7일
0

typescript

목록 보기
10/11
post-thumbnail

@Decorators

  • 아직 표준화되지 않은 문법
  • 자바스크립트 mixin과 비슷한 기능
  • 기존의 함수나 클래스를 좀더 다양한 형태로 재활용 할수있는 기법
  • 어노테이션을 활용하여 기존의 존재하는 함수나 클래스를 한단계 감싸서 원하는 추가 기능을 넣는 방법
  • Angular에서 자주 사용되는 문법

어노테이션이란?
어노테이션(Annotation)은 메타데이터(metadata)라고 볼 수 있습니다.
메타데이터는 Application이 처리하는 데이터가 아니고, 컴파일 과정과 런타임 과정에서 코드를 어떻게 컴파일하고 처리할것인지를 알려주는 정보입니다.
어노테이션은 다음과 같은 형태로 작성됩니다.
@AnnotationName
어노테이션은 다음 세가지 용도로 사용됩니다.
1.컴파일러에게 코드 문법 에러를 체크하도록 정보를 제공
2.소프트웨어 개발 툴이 빌드나 배치 시 코드를 자동으로 생성할 수 있도록 정보를 제공
3.실행 시(런타임 시) 특정 기능을 실행하도록 정보를 제공

예제

tsconfig.json

아직 비표준 문법이라 tsconfig.json에서 옵션값을 true로 변경해주어야 한다.

{
  "compilerOptions": {
      "experimentalDecorators": true,
  }
}
function sealed(constructor: Function) {
  Object.seal(constructor);
  Object.seal(constructor.prototype);
}

// 사용하는 곳에서 어노테이션으로 간편하게 사용
@sealed
class Greeter {
  greeting: string;
  constructor(message: string) {
    this.greeting = message;
  }
greet() {
  return `Hello, ${this.greeting}`;
  }
}

Object.seal() 메서드는 객체를 밀봉합니다.
객체를 밀봉하면 그 객체에는 새로운 속성을 추가할 수 없고, 현재 존재하는 모든 속성을 설정 불가능 상태로 만들어줍니다. 하지만 쓰기 가능한 속성의 값은 밀봉 후에도 변경할 수 있습니다
(역자 주 : 바로 이 점이 Object.freeze()와의 차이라고 할 수 있습니다).

profile
Front-End 😲

0개의 댓글