변수, 매개변수, 리턴값에 타입 붙이기
Type Annotation
const a: number = 5;
const b: string = '5';
const c: boolean = true;
const d: undefined = undefined;
const e: null = null;
const f: symbol = Symbol.for('abc');
const g: bigint = 1000000n;
const h: any = true;
// any를 쓰게되면 자바스크립트가 되어버린다.(쓰지 않는다)
TypeScript
복사
•
타입 대소문자 확실히!! (소문자로!!)
function add(x: number, y: number): number { return x + y }
const add: (x: number, y: number) => number = (x, y) => x + y;
const obj: { lat: number, lan: number } = { lat: 37.5, lan: 127.5 }
TypeScript
복사
•
각자의 자리 확실하게 구분!
Object
Array
let arr: number[] = [1, 2, 3];
let arr: Array<number> = [1, 2, 3];
// 제네릭을 사용할 수 있다
TypeScript
복사
Tuple
튜플은 배열의 길이가 고정되고, 각 요소의 타입이 지정되어 있는 배열 형식을 의미한다
let arr: [string, number] = ['hi', 10];
TypeScript
복사
만약 정의하지 않은 타입, 인덱스로 접근할 경우 오류가 난다
arr[1].concat('!'); // Error, 'number' does not have 'concat'
arr[5] = 'hello'; // Error, Property '5' does not exist on type '[string, number]'.
TypeScript
복사
Enum
Enum 은 C, Java와 같은 다른 언어세어 흔하게 쓰이는 타입으로 특정 값(상수)들의 집합을 의미한다
enum Avengers { Capt, IronMan, Thor }
let hero: Avengers = Anvengers.Capt;
TypeScript
복사
Enum은 인덱스 번호로도 접근할 수 있다
enum Avengers { Capt, IronMan, Thor }
let hero: Avengers = Avengers[0];
TypeScript
복사
만약 원한다면, Enum의 인덱스를 사용자 편의로 변경하여 사용할 수도 있다
enum Avengers { Capt = 2, IronMan, Thor }
let hero: Avengers = Avengers[2]; // Capt
let hero: Avengers = Avengers[4]; // Thor
TypeScript
복사
const enum EDirection {
Up, // 0
Down, // 1
Left, // 2
Right, // 3
}
const a = EDirection.Up;
const c = EDirection.Left;
// -> 객체로 주로 사용
const ODirection = {
Up: 0,
Down: 1,
Left: 2,
Right: 3,
} as const;
TypeScript
복사
Any
기존에 자바스크립트로 구현되어 있는 웹 서비스 코드에 타입스크립트를 점진적으로 적용할 때 활용하면 좋은 타입이다.
단어 의미 그대로 모든 타입에 대해서 허용한다는 의미를 갖고 있다.
let str: any = 'hi';
let num: any = 10;
let arr: any = ['a', 2, true];
TypeScript
복사
Void
변수에는 undefined 와 null만 할당하고, 함수에는 반환 값을 설정할 수 없는 타입이다.
let unuseful: void = undefined;
function notuse(): void {
console.log('sth');
}
TypeScript
복사
Never
함수의 끝에 절대 도달하지 않는다는 의미를 지닌 타입
// 이 함수는 절대 함수의 끝까지 실행되지 않는다는 의미
function neverEnd(): never {
while (true) {
}
}
TypeScript
복사