TypeScript
클래스 장식 자
수색…
매개 변수
매개 변수 | 세부 |
---|---|
목표 | 장식되는 수업 |
기본 클래스 데코레이터
클래스 장식 자 (class decorator)는 클래스를 유일한 인수로 사용하고 그 클래스로 무언가를 한 후에 반환합니다.
function log<T>(target: T) {
// Do something with target
console.log(target);
// Return target
return target;
}
그런 다음 클래스 데코레이터를 클래스에 적용 할 수 있습니다.
@log
class Person {
private _name: string;
public constructor(name: string) {
this._name = name;
}
public greet() {
return this._name;
}
}
클래스 데코레이터를 사용하여 메타 데이터 생성하기
이번에는 클래스 데코레이터를 선언하여 적용 할 때 클래스에 메타 데이터를 추가합니다.
function addMetadata(target: any) {
// Add some metadata
target.__customMetadata = {
someKey: "someValue"
};
// Return target
return target;
}
그런 다음 클래스 데코레이터를 적용 할 수 있습니다.
@addMetadata
class Person {
private _name: string;
public constructor(name: string) {
this._name = name;
}
public greet() {
return this._name;
}
}
function getMetadataFromClass(target: any) {
return target.__customMetadata;
}
console.log(getMetadataFromClass(Person));
데코레이터는 클래스의 인스턴스를 만들 때 클래스가 선언되지 않을 때 적용됩니다. 즉, 클래스의 모든 인스턴스에서 메타 데이터가 공유됩니다.
function getMetadataFromInstance(target: any) {
return target.constructor.__customMetadata;
}
let person1 = new Person("John");
let person2 = new Person("Lisa");
console.log(getMetadataFromInstance(person1));
console.log(getMetadataFromInstance(person2));
인수를 클래스 데코레이터에 전달
클래스 데코레이터를 다른 함수로 래핑하여 사용자 정의 할 수 있습니다.
function addMetadata(metadata: any) {
return function log(target: any) {
// Add metadata
target.__customMetadata = metadata;
// Return target
return target;
}
}
addMetadata
는 구성으로 사용 된 몇 가지 인수를 취한 다음 실제 데코레이터 인 이름없는 함수를 반환합니다. 데코레이터에서는 클로저가 제자리에 있기 때문에 인수에 액세스 할 수 있습니다.
그런 다음 몇 가지 구성 값을 전달하는 데코레이터를 호출 할 수 있습니다.
@addMetadata({ guid: "417c6ec7-ec05-4954-a3c6-73a0d7f9f5bf" })
class Person {
private _name: string;
public constructor(name: string) {
this._name = name;
}
public greet() {
return this._name;
}
}
우리는 다음 함수를 사용하여 생성 된 메타 데이터에 액세스 할 수 있습니다.
function getMetadataFromClass(target: any) {
return target.__customMetadata;
}
console.log(getMetadataFromInstance(Person));
모든 것이 올바르게 진행되면 콘솔에 다음과 같이 표시됩니다.
{ guid: "417c6ec7-ec05-4954-a3c6-73a0d7f9f5bf" }
Modified text is an extract of the original Stack Overflow Documentation
아래 라이선스 CC BY-SA 3.0
와 제휴하지 않음 Stack Overflow