
let name: string | number = 'kim';
let age: (string | number) = 100;
name, age 변수엔 string 또는 number만 들어옴
그리고 할당하는 순간 타입은 string 또는 number 중 하나로 변한다.
var array: (number | string)[] = [1,'2',3]
var object: {data : (number | string) } = { data : '123' }
괄호를 안하고 number | string[]이면 number 또는 string 배열이라고 인식.(number는 배열이라고 인식 안함)
아무 자료나 집어넣을 수 있는 타입
let 이름: any = 'kim';
이름 = 123;
이름 = undefined;
이름 = [];
any 타입은 막쓰면 타입스크립트 쓰는 의미가 없음.
타입관련 버그가 생길 경우 왜 그런지 추적하기가 어렵다.
any와 똑같이 모든 타입을 집어넣을 수 있다.
자료집어넣어도 타입은 그대로 unknown
unknown은 숫자를 넣어도 number타입이 아님(연산 불가능)
let 이름: unknown = 'kim';
이름 = 123;
이름 = undefined;
이름 = [];
// 아래 코드는 불가능, any타입에서는 가능
let 이름: unknown;
// unknown타입은 다른 타입이 안됨
let 변수1: string = 이름;
let 변수2: boolean = 이름;
let 변수3: number = 이름;
// unknown타입이라 불가능
이름[0]; // 배열 값 할당해주면 가능
이름 - 1; // 숫자 할당해줘도 불가능
이름.data; // object 할당해줘도 불가능
아직 뭘 집어넣을지 모르겠는데 약간의 안정성을 도모하고 싶으면 unknown 타입을 쓰는 것이 좋다.
함수는 총 두 군데 타입지정이 가능
1. 함수로 들어오는 자료 (파라미터)
2. 함수에서 나가는 자료 (return)
function 내함수(x :number) :number {
return x * 2
}
return할 자료가 없는 함수의 타입
function 내함수(x :number) :void {
x * 2
}
함수에 파라미터자리를 만들어놨지만 가끔 파라미터 없이 쓸 때
function 내함수(x? :number) {
}
내함수(); //가능
내함수(2); //가능
파라미터의 물음표는 x : number | undefined 이거랑 똑같은 의미
// 에러 발생
function 함수(x :number | string): number{
return x + 1
}
타입스크립트에선 변수의 타입이 number | string 이런 union type인 경우 자료 조작을 금지시킵니다.
아직 이 파라미터의 타입이 확실하지 않으니까 파라미터 조작을 일단 실드로 막고 금지하는 것입니다.
에러 발생 하지 않으려면 narrowing을 사용해야 함
if문 등으로 타입을 하나로 정해주는 것
function 내함수(x :number | string){
if (typeof x === 'number') {
return x + 1
}
else if (typeof x === 'string') {
return x + 1
}
else {
return 0
}
}
if문과 typeof 키워드로 현재 파라미터의 타입을 검사
꼭 typeof를 쓸 필요는 없고 타입을 하나로 확정지을 수 있는 코드라면 어떤 것도 Narrowing 역할을 할 수 있습니다.
in, instanceof 키워드도 사용가능합니다.
타입 덮어씌우기 변수명 as string
function 내함수(x :number | string){
return (x as number) + 1 // x를 number로 덮어 씌우기, number타입 됨
}
console.log( 내함수(123) )
}
여러개의 타입을 하나로 하고 싶을 때 사용
타입을 다른걸로 변경하는 것은 안됨
무슨 타입이 들어올지 100% 확실할 때(다른 타입을 넣으면 에러를 띄우지 못함)
출처: coding apple