source

TS에서 문자열 enum과 문자열 리터럴 유형의 차이

manysource 2023. 3. 21. 22:21

TS에서 문자열 enum과 문자열 리터럴 유형의 차이

내가 확실히 하고 싶다고 가정할 때myKey{ myKey: '' }문자열만 포함됩니다.foo,bar,baz두 가지 방법으로 이것을 달성할 수 있었다.

   // with a String Literal Type 
   type MyKeyType = 'foo' | 'bar' | 'baz';

    // or with a String Enum   
    enum MyKeyType {
       FOO = 'foo',
       BAR = 'bar',
       BAZ = 'baz'
    }

둘 다 똑같아 보이기 때문에 장단점은 어디에 있는지 궁금합니다(상태 체크 등의 값에 액세스하는 방법에서 제외).

TS 문서에서 발견한 유일한 차이점은 실행 시 Enum이 실제 개체라는 것입니다. 경우에 따라서는 이것이 바람직할 수 있습니다.

이해해야 할 중요한 것은 문자열 enum의 값이 불투명하다는 것입니다.

문자열 열거의 의도된 사용 사례는 다른 코드가 리터럴 문자열 백업에 대해 알거나 신경 쓰지 않도록 하는 것입니다.MyKeyType.FOO즉, 문자 그대로의 문자열을 전달할 수 없다는 뜻입니다. "bar"수용하는 함수로MyKeyType-- 글을 써야 합니다.MyKeyType.BAR대신.

스트링 에넘과 리터럴 타입의 차이는 있습니다.

타이프스크립트 코드 비교

// with a String Literal Type 
type MyKeyType1 = 'foo' | 'bar' | 'baz';

// or with a String Enum   
enum MyKeyType2 {
   FOO = 'foo',
   BAR = 'bar',
   BAZ = 'baz'
}

변환된 JavaScript 코드 사용

// or with a String Enum   
var MyKeyType2;
(function (MyKeyType2) {
    MyKeyType2["FOO"] = "foo";
    MyKeyType2["BAR"] = "bar";
    MyKeyType2["BAZ"] = "baz";
})(MyKeyType2 || (MyKeyType2 = {}));

여기서 알 수 있는 것은 문자열 리터럴에 대해 생성된 코드가 없다는 것입니다.왜냐하면 Typescripts 트랜스필러는 전사를 하는 동안 형식 안전을 위해서만 사용합니다.런타임 문자열에서는 리터럴이 "dumb" 문자열로 생성됩니다.리터럴 정의와 사용법 사이에 참조가 없습니다.

그래서 const enum이라는 세 번째 대안이 있습니다.

이것 좀 봐요.

// with a String Literal Type 
type MyKeyType1 = 'foo' | 'bar' | 'baz';

// or with a String Enum   
enum MyKeyType2 {
   FOO = 'foo',
   BAR = 'bar',
   BAZ = 'baz'
}

// or with a Const String Enum   
const enum MyKeyType3 {
   FOO = 'foo',
   BAR = 'bar',
   BAZ = 'baz'
}

var a : MyKeyType1 = "bar" 
var b: MyKeyType2 = MyKeyType2.BAR
var c: MyKeyType3 = MyKeyType3.BAR

로 번역될 것이다.

// or with a String Enum   
var MyKeyType2;
(function (MyKeyType2) {
    MyKeyType2["FOO"] = "foo";
    MyKeyType2["BAR"] = "bar";
    MyKeyType2["BAZ"] = "baz";
})(MyKeyType2 || (MyKeyType2 = {}));
var a = "bar";
var b = MyKeyType2.BAR;
var c = "bar" /* BAR */;

더 많은 재생을 위해 이 링크를 확인하십시오.

Enum을 입력하는 편리한 방법 때문에 const enum 케이스를 선호합니다.값. 나머지는 타이프 스크립트가 알아서 번역할 때 최고의 성능을 낼 수 있을 거야.

개발 시 열거형의 장점 중 하나는 인텔리센스를 통해 옵션 목록을 쉽게 볼 수 있다는 것입니다.

여기에 이미지 설명 입력

마찬가지로 리팩터링 도구를 사용하여 열거형 값을 쉽게 변경할 수 있으며, 모든 문자열은 변경할 수 없습니다.

편집: VS 2017 및 TypeScript > = 3.2.4에서 intellisense는 문자열 리터럴 유형과 함께 작동합니다.

여기에 이미지 설명 입력

문자열 리터럴 대신 enum을 사용하면 유형을 선언하지 않는 장소에서도 사용할 수 있다는 장점이 있습니다.

예를 들어 -

assert.equal(result.keyType, KeyType.FOO)

enum의 큰 단점은 문자열 대신 숫자를 사용하는 경우 전체 enum이 안전하지 않다는 것입니다.이러한 종류의 변수에는 항상 임의의 숫자 값을 할당할 수 있습니다.

enum TYPE {MAN = 1, WOMAN = 2, BOY = 3, GIRL = 4};
let foo: TYPE = TYPE.MAN;
foo = 37.14; //no problem for compiler

언급URL : https://stackoverflow.com/questions/49761972/difference-between-string-enums-and-string-literal-types-in-ts