이 내용은 코드앙마의 타입스크립트 강좌를 정리해놓은 자료이다.
문자열 타입
let car:string = 'bmw';
car = 'benz';
car는 문자열이다. 문자열에는 string으로 타입을 지정할 수 있다.
let car:string = 'bmw';
car = 1; // 오류
car에 숫자로 된 값을 넣으면 에러가 발생하는 것을 알 수 있다.
타입 추론
타입스크립트는 타입을 지정하지 않으면 값을 가지고 예측을 한다.
//예)
let car = 'bmw'; // car는 string으로 지정
//예)
let car = 123; // car는 number로 지정
다른 타입
let age:number = 30; // number로 지정
let isAudult :boolean= true; // boolean 타입
let a:number[] = [1, 2, 3]; // 배열
let a2:Array<number> = [1, 2, 3]; // 배열은 이런식으로도 된다.
let week1:string[] = ['mon', 'tue', 'wed']; // 문자열 배열
//week1.push(3); // 문자열 배열에 숫자를 추가하면 에러가 발생
let week2:Array<string> = ['mon', 'tue', 'wed'];
다양한 유형의 타입으로 지정할 수 있다.
튜플 (Tuple)
튜플은 배열 모양인데 인덱스별로 타입이 다를 때 이용할 수 있다.
let b:[string, number];
b = ['z', 1]; // 이렇게 입력하는 것은 가능
//b = [1, 'z']; // 이렇게 입력하는 것은 불가능
//문자을 소문자로 변환하는 toLowerCase()
b[0].toLowerCase(); // 가능
b[1].toLowerCase(); // 불가능
타입을 미리 알고 있기 때문에 .(dot)을 찍었을 때 미리 알 수 있다.
void, never 타입
void는 함수에서 아무것도 반환하지 않을 때 사용할 수 있다.
function sayHello():void {
console.log('hello');
}
never는 에러를 반환하거나 영원히 끝나지 않는 타입으로 사용할 수 있다.
function showError():never {
throw new Error();
}
function infLoop():never {
while(true) {
// do something
}
}
enum 타입
javascript에는 없는 타입이다. enum은 비슷한 타입으로 묶어 놓은 것이다.
enum Os {
Window,
Ios,
Android
};
마우스를 올려보면 Window는 0, Ios는 1, Android는 2로 할당이 되는 것을 알 수 있다.
enum Os {
Window = 3,
Ios, // 4
Android // 5
};
여기서 Window를 3으로 변경하면 Ios는 4, Android는 5가 된다.
enum Os {
Window = 3,
Ios= 10l,
Android // 11
};
Ios를 10으로 바꾸면 Android가 11이 된다.
위의 코드를 javascript로 컴파일된 코드를 보면 아래와 같다.
var Os;
(function (Os) {
Os[Os["Window"] = 3] = "Window";
Os[Os["Ios"] = 10] = "Ios";
Os[Os["Android"] = 11] = "Android"; // 11
})(Os || (Os = {}));
;
이것의 의미는 아래와 같다.
console.log(Os[10]); // Ios가 나오고
console.log(Os['Ios']); // 10이 나온다는 말이다.
enum에는 숫자가 아닌 문자열도 입력할 수 있다.
enum Os {
Window = 'win',
Ios= 'ios',
Android = 'and'
};
이럴 때는 숫자가 아닐 때는 단방향 매핑만 가능하다.
위의 코드는 아래와 같은 코드가 된다는 의미이다.
const Os = {
Window : 'win',
Ios : 'ios',
Android : 'and'
};
let myOs:Os;
myOs는 Os 타입이라고 정의하면 myOs에서는 Window, Ios, Android만 입력이 가능하다
특정 값만 입력하도록 강제하고 싶을 때 enum을 사용하면 된다.
null, undefined 타입
let a:null = null;
let b:undefined = undefined;
반응형