TypeScript union타입, any타입, unknown 타입

let name1 :string = 'kim'
let age :number = 25;
let friend :null = null; //undefined, null 타입도 있음.
let male :boolean = true;

변수에 타입지정이 가능하다는 것은 타입이 실수로 변경되는 것을 방지할 수 있는것을 의미한다.

let arr : number[] = [123,456];

Array도 type을 지정하여 사용한다. 위 배열의 요소는 number만 올 수 있다.

유니온타입 Union Type

let member : number | string = 'kim';

유니온타입은 타입 2개 이상을 합쳐 새로운 타입을 만든다. member 변수에는 string, number 두가지 타입이 올 수 있다.

배열과 오브젝트의 타입지정은 어떻게 해야할까

let members : ???[] = [1,'2',3];
let obj :{a: ??? } = {a:'123'}

창의력을 발휘해서 시도해보자

let members : string|number[] = [1,'2',3];

라고 풀었다면 에러가 날것이다. string|number[] 의 의미는 members에 string타입 혹은 number타입의 배열이 올 수 있다는 의미를 가진다. 따라서

정답은

let members : (string|number)[] = [1,'2',3];

괄호를 쳐주거나

type MemberType = string |number
let members : MemberType[] = [1,'2',3];

타입을 지정해줄 수 있을것 같다.

object는 그냥

let obj :{a:string|number} = {a:'123'}

생각대로 풀어보니 잘 되었다.

any type

any 타입은 모든 자료형을 허용해준다.

let 이름 : any;
이름 = 123;
이름 = []

이처럼 다양한 타입을 집어넣어도 에러가 나지 않는데. 하지만 이를 막 사용하면 TypeScript를 쓰는 의미가 없어질 것이다.

unknown type

let 이름 : unknown;
이름 = 123;
이름 = []

unknown도 any와 유사하다. 하지만 any보다 조금 더 안전하다. any보다 안전한 이유는 아래와 같은 차이가 있다.

let 이름 : any;
이름 = 123;
이름 = []

let 변수:string = 이름;

any의 경우 새로 생성하는 변수의 타입조차 해제해버린다.

하지만

let 이름 : unknown;
이름 = 123;
이름 = []

let 변수:string = 이름;

unknown은 'unknown' 형식은 'string' 형식에 할당할 수 없습니다.

와 같은 에러를 출력해준다. any로 오염되는것을 방지해주기 때문에 any보다는 안전하다고 볼 수 있다.

연산

또 타입스크립트는 간단한 수학연산도 타입이 맞아야한다.

let 이름 : unknown;
이름 - 1;

산술 연산의 왼쪽은 'any', 'number', 'bigint' 또는 열거형 형식이어야 합니다.

unknown의 경우 연산을 미연에 방지할 수 있다. 하지만 any의 경우

let 이름 : any;
이름 - 1;

NaN이겠지만 , 계산이 된다.

Union Type + 연산

UnionType의 + 연산은 어떻게 처리될까

let 나이 :string|number;
나이 + 1;

에러가 발생한다. Javascript에서는 string과 number의 + 연산이 가능하다.

"test" + 12 는 "test12" 가 되고 "1"+"2"는 12가된다. 그리고 1+2는 3이된다. 그런데 왜 타입스크립트에서는 에러가 발생할까. 타입스크립트는 엄격하다. 그리고 유니온타입은 두가지 타입을 합쳐서 새로운 타입을 만들어 내는것이다. 따라서 string|number 타입의 경우 연산이 안된다.

string 타입 + number = 가능

number타입 + number = 가능

string|number + number = 불가능

unknown타입 연산

let 나이 : unknown = 1;
나이 - 1;

위의 경우에 나이에 숫자가 들어있지만 타입이 unknown이다. 타입스크립트는 any, bigint, number 형태만 연산을 해준다. 따라서 안됨