본문 바로가기

공부 정리

22.12.21: 타입스크립트 타입들 - Union, Any, Unknown

반응형

타입스크립트는 변수를 만들때 타입을 지정할 수 있다.

자주 쓰는 type들은 다음과 같음

 

let 이름 :string = 'Kim'
let 나이 :number = 20;
let 여성 :boolean = true;

 

array 또는 object 자료 안에서도 타입을 지정한다

 

let name :string[] = ['Kim', 'Park']

 

array안에 다른 타입이 동시에 들어갈 때

 

let 회원들 :(string | number)[] = ['Kim', 22]

 

object 자료 안에 들어가는 타입은 object 모습과 같다.

 

let kkongJji: { age : number } = { age : 2 }

 

하지만 모든 변수에 타입을 지정 할 필요는 없다. 변수 생성시 타입스크립트가 타입을 자동으로 부여 해 준다. 

 

Union type 

 

| 연산자를 사용해 변수에 여러 type이 들어오게 할 수 있다. 

 

let name: string | number = 'kim';
let age: (string | number) = 100;

 

name, age 변수엔 string or number만 가능. 할당하는 순간 타입은 string이나 number 중 하나로 변함

 

array, object 자료 만들 때 union type 쓰는 법

 

var array: (number|string)[] = [1, '2', 3]
var object: {data: (number|string) } = { data : '123' }

 

Any type

아무 자료나 넣을 수 있는 타입. 타입이 바뀌어도 에러가 나지 않는다. 버그를 추적하기 어려워지기 때문에 사용 자주 안함.

비상시에 쓰는 변수 타입체크 해제기능 등에 쓰임.

 

Unknown type

 

let name: unknown;

let 변수1: string = name;
let 변수2: boolean = name;
let 변수3: number = name;

 

unknown형식은 위와 같은 형식에 할당 할 수 없다는 에러가 뜸. any는 이런 메세지가 안뜸.

 

let 이름: unknown;
이름[0];
이름 - 1;
이름.data;

 

이런 경우에도 에러가 남. unknown은 연산할 수 없고 unknown에 data라는 속성이 없다고 뜸. 아직은 뭘 집어넣을지 모르는데 약간의 안정성을 도모하고 싶다면 unknown 타입을 써볼 수 있다. 거의 안쓰긴 함

 

 

예제 1)

 

let user: string = 'kim';
let age: number | undefined = undefined;
let married: boolean = false;
let 철수: (string|undefined|boolean)[] = [user, age, married];

 

예제 2)

 

let 학교: {
	score: (number| boolean)[],
    teacher: string,
    friend: string | string[]
} 

= {
    score : [100, 97, 84],
    teacher : 'Phil',
    friend : 'John'
}

학교.score[4] = false;
학교.friend = ['Lee' , 학교.teacher]

 

 

Reference 

코딩애플 TypeScript 강의

반응형