programing

열거에 설명 특성을 추가하고 TypeScript에서 이 설명을 읽습니다.

megabox 2023. 6. 13. 22:10
반응형

열거에 설명 특성을 추가하고 TypeScript에서 이 설명을 읽습니다.

TypeScript에서 열거할 설명 속성을 추가하는 방법이 궁금합니다.다음과 같이 열거형을 만들고 싶습니다.

public enum Sample
{
    [Display(Name = "Blah V")]
    V,

    [Display(Name = " Blah IV")]
    IV,

    [Display(Name = " Blah III")]
    III,
}

이러한 열거형에서 기본 작업을 수행할 수 있도록 일반 EnumHelper를 생성합니다.이 도우미 클래스에는 설명 값 가져오기, 이름 및 숫자 값 가져오기와 같은 방법이 포함되어야 합니다.문제는 이를 어떻게 타이프스크립트로 달성하느냐 하는 것입니다.만약 열거형에 속성을 추가할 수 없다면, 다른 방법이 없을까요?저는 다음과 같은 일을 하고 싶습니다.

-  get number of enum value,
-  get description value,
-  get the name of enum field.

예: 샘플용.IV 다음과 같습니다.

1, 
Blah IV, 
IV.

여기서 확인할 수 있는 또 다른 흥미로운 솔루션은 ES6 Map:

export enum Sample {
  V,
  IV,
  III
}

export const SampleLabel = new Map<number, string>([
  [Sample.V, 'FIVE'],
  [Sample.IV, 'FOUR'],
  [Sample.III, 'THREE']
]);

사용하다

console.log(SampleLabel.get(Sample.IV)); // FOUR

SampleLabel.forEach((label, value) => {
  console.log(label, value);
});

// FIVE 0
// FOUR 1
// THREE 2  

아래의 방법은 형식 안전(자동 완성 작업)이며 일반 객체를 사용합니다.TypeScript의 이 기능을 기반으로 합니다.

export enum Sample {
  I = 1,
  II = 2,
  III = 3
}

export const SampleLabel: { [key in Sample]: string } = {
  [Sample.I]: "ONE",
  [Sample.II]: "TWO",
  [Sample.III]: "THREE",
};

TypeScript에서는 속성을 다음에 추가할 수 없습니다.enum요소. 런타임에 기본 문자열 또는 숫자에 불과합니다.대신 이러한 요소에 대한 참조를 보유하고 원하는 방법이나 속성을 가진 새로운 유형을 만들어야 합니다.

여기 가능한 한 가지 방법이 있습니다.당신의 평원부터 시작하세요.enum다음과 같이:

enum SampleEnum {
  V, IV, III
}

확장 유형에 대한 인터페이스 정의를 제공합니다.그것은 있습니다.name,adescription그리고 anumber이 유형은 일반적이므로 범위를 좁힐 수 있습니다.name그리고.number바로 입력:

interface ISample<N extends number, S extends string> {
  readonly name: S;
  readonly description: string;
  readonly number: N;
}

여기 당신을 데려갈 수 있는 기능이 있습니다.SampleEnum확장 인터페이스를 구현하는 값을 사용하여 동일한 키를 사용하여 개체를 지정하고 반환합니다.

function makeSample<E extends Record<Extract<keyof E, string>, number>>(
  mapping: E
): { [K in Extract<keyof E, string>]: ISample<E[K], K> } {
  const ret = {} as { [K in Extract<keyof E, string>]: ISample<E[K], K> };
  (Object.keys(mapping).filter(k => k !== (+k) + "") as
    (Extract<keyof E, string>)[]
  ).forEach(k => {
    ret[k] = {
      name: k,
      description: "Blah " + k,
      number: mapping[k]
    }
  });
  return ret;
}

그것은 많은 유형의 저글링일 수 있지만 기본적으로 문자열 값 키를 추출하는 것입니다.SampleEnum(그리고 런타임에 숫자 키를 숫자 열거에 추가하는 역방향 매핑을 무시함) 그리고 각 확장 인터페이스의 인스턴스를 다소 안전한 방식으로 구축합니다.

마지막으로, 다음을 생성합니다.Sample우리를 대표하는 가치와 유형.enum:

const Sample = makeSample(SampleEnum);
type Sample = (typeof Sample)[keyof typeof Sample]

좋아요, 사용해요:

const nameOfIV = Sample.IV.name; // "IV"
console.log(nameOfIV); // "IV"
const numberOfIII = Sample.III.number; // SampleEnum.III
console.log(numberOfIII); // 1
const descriptionOfV = Sample.V.description; // string
console.log(descriptionOfV); // "Blah V"

const goodSample: Sample = Sample.III; // okay
const badSample: Sample = {
  name: "II", 
  description: "oops", 
  number: 3
}; // error, name doesn't match

제가 보기엔 합리적인 것 같아요.직접 보세요.물론 그것에 접근할 수 있는 다른 방법들이 있지만 이것이 당신에게 아이디어를 줄 수 있기를 바랍니다.도움이 되길 바랍니다.행운을 빕니다.

허용된 답변의 변형입니다.교체하다number당신과 함께enumtype을 더 안전하게 입력합니다.

 export enum Sample {
      V,
      IV,
      III
    }

export const SampleLabel = new Map<Sample, string>([
  [Sample.V, 'FIVE'],
  [Sample.IV, 'FOUR'],
  [Sample.III, 'THREE']
]);

이 패턴은 나에게 효과가 있었습니다.

export enum PriceTypes {
    Undefined = 0,
    UndefinedDescription = 'Undefined' as any,
    UserEntered = 1,
    UserEnteredDescription = 'User Entered' as any,
    GeneratedFromTrade = 2,
    GeneratedFromTradeDescription = 'Generated From Trade' as any,
    GeneratedFromFreeze = 3,
    GeneratedFromFreezeDescription = 'Generated Rom Freeze' as any
}

...

    GetDescription(e: any, id: number): string {
        return e[e[id].toString() + "Description"];
    }
    getPriceTypeDescription(price: IPricePoint): string {
        return this.GetDescription(PriceTypes, price.priceType);
    }

언급URL : https://stackoverflow.com/questions/50784444/add-description-attribute-to-enum-and-read-this-description-in-typescript

반응형