본문 바로가기

개발/typescript

typescript docs 번역본 #5 (Unions and Intersection Types)

반응형

아래 링크는 원본입니다. 해석이 부족해도 양해 부탁드립니다..ㅎㅎ

 

www.typescriptlang.org/docs/handbook/unions-and-intersections.html

 

Handbook - Unions and Intersection Types

How to use unions and intersection types in TypeScript

www.typescriptlang.org

 

```

지금까지 handbook은 원자 객체인 type들을 다뤄왔습니다. 그러나 더 많은 타입을 만들수록, 스크래치로부터 그들을 만들기 보단 존재하는 type들을 결합하거나 짓도록 하는 툴들을 기대하는 자신을 발견할 것입니다.

 

Intersection union type은 당신이 type을 짓는 방식 중 하나 입니다.

 

 

Union Types

때때로, number string이 각각 되는 파라미터를 기대하는 라이브러리를 실행할 수 있습니다. 예를 들어 따르는 예를 다뤄보겠습니다.

 

위 예속 padLeft의 문제는 padding 파라미터가 any로 지어진 것입니다. 이것은 number string이 아닌 독립변수를 호출할 수 있음을 의미하지만, Ts는 괜찮습니다.

 

전통적인 객체 지향 코드에서, type 계층을 생성함으로써 두 type들을 추상화 할 수 있습니다. 이것은 훨씬 명확하지만, 약간 과하기도 합니다. 오리지널 버전의 padLeft로 가장 좋은 것은 기초요소를 전달할 수 있다는 것입니다. 이는 사용이 간단하고 정확함을 의미합니다. 이 새로운 접근은 만약 우리가 이미 존재하는 함수를 실행하고자 할 때는 도움되지 않습니다.

 

any대신에 padding 파라미터에 union type을 사용할 수 있습니다.

 

Union type은 몇몇 타입 중 가능한 값을 묘사합니다. 우리는 |을 사용해 각 타입을 나누고, number | string | boolean number, string, boolean이 될 수 있는 변수의 타입입니다.

 

 

Union with Common Fields

만약 union type의 값을 가지고 있다면, union안에서 공통되는 요인에 접근할 수 있습니다.

 

Union type들은 여기서 교활하지만, 익숙해지려면 약간의 직관이 필요합니다. 만약 값이 A | B type을 가지고 있다면, 우리는 A B 모두를 가진 구성원이 있다는 것을 확실히 알 수 있습니다.

이 예시에서, Bird fly 구성원을 가지고 있습니다. Bird | Fist type이 정해진 값이 fly 메소드를 가졌는지 확신할 수 없습니다. 만약 런타임 때 변수가 Fish이면, pet.fly()는 실패합니다.

 

 

Discriminationg Unions

union으로 작동하는 공통 기술은 Ts가 최근 type을 좁히도록 하는 리터럴 type을 사용하는 단일 필드를 가지는 것입니다. 예를 들어, 공유된 단일 필드를 가지는 세 type union을 생성할 것입니다

 

위 모든 type들은 state 필드를 가지고 있고, 그들 고유의 필드도 가지고 있습니다.

 

주어진 state 필드는 NetworkState안 모든 타입에서 공통됩니다(그것은 당신의 코드가 존재확인 없이 접근하기에 안전합니다).

 

리터럴 타입의 state와 함께 당신은 state의 값을 동등한 문자열과 비교할 수 있고, Ts는 어떤 타입이 최근에 사용되었는지 알 수 있을 것입니다.

 

이 경우, 당신은 어떤 type이 런타임에 사용되었는지 좁히기 위해 switch를 사용할 수 있습니다.

 

 

Union Exhastiveness checking

차별된 모든 union의 값을 다루지 못할 때, 우리는 컴파일러가 말해주길 바랍니다. 예를 들어, NetworkState NetworkFromCachedState를 더한다면, 우리는 logger을 업데이트할 필요성이 있습니다.

 

두 방법이 있습니다. 첫번째는 –strictNullChecks를 키고 리턴 타입을 명확히 하는 것입니다.

 

Switch는 더 이상 철저하지 않기 때문에, Ts는 함수가 종종 undefined를 리턴함을 인지합니다. 만약 명확한 string 리턴 타입을 가지고 있으면, 리턴 타입은 실제로 string | undefined이기에 에러가 발생할 것입니다. 그러나 이 메소드는 미묘하고 게다가, -strictNullChecks는 오래된 코드에서 항상 작동하지 않습니다.

 

두번째 메소드는 컴파일러가 철저함을 위해 확인하는 never type을 사용합니다

 

여기서 assertNevers never타입인지 확인합니다(다른 모든 case 이후 남아있는 type들은 삭제되었습니다). 만약 case를 잊었다면, s는 실제 type을 가질 것이며 error type을 발생합니다. 이 메소드는 당신이 추가 함수를 정의하도록 요구하지만, 에러 메시지는 놓친 type이름을 포함하기에 당신이 잊었을 때 더 명확할 수 있습니다.

 

 

Intersection types

Intersection type들은 거의 union type들과 관련있지만, 매우 다르게 사용됩니다. Intersection type은 다중 type들을 하나로 결합합니다. 이것은 당신이 원하는 모든 특징을 가진 단일 type을 갖기 위해 존재하는 type들을 더하도록 해줍니다. 예를 들어, Person & Serializable & LoggablePerson, Serializable, Loggable 모두의 type입니다. 이는 type객체가   type의 모든 구성원을 가지고 있음을 의미합니다.

 

예를 들면, 만약 당신이 지속적인 에러 헨들링을 하는 네트워킹 요청을 가진다면, 단일 응답 type과 일치하는 type type들이 합쳐진 그것의 고유 type에서 에러

헨들링을 분리할 수 있을 것입니다

'개발 > typescript' 카테고리의 다른 글

type concat  (0) 2022.05.02
typescript+pwa 구현하기  (0) 2021.04.29
typescript docs 번역본 #4 (Literal types)  (0) 2021.01.25
typescript docs 번역본 #3 (functions)  (0) 2021.01.20
typescript docs 번역본 #2 (interfaces)  (0) 2021.01.19