728x90
728x90
제네릭은 타입을 동적으로 설정할 수 있게 해주는 문법이다. 외부에서 타입을 주입하여, 동적으로 타입을 설정할 수 있기에 재사용이 가능한 컴포넌트를 구현하는데 있어서 핵심이다. 타입스크립트에서 가장 간단한 제네릭의 예이다. // typescript v5.0.4 function printf(i: T): void { console.log(i); } printf("Hi ~"); printf(123); printf("Zombie~"); // 제네릭 타입도 추론이 가능하다. printf 함수의 인자는 어떤 타입의 변수든 인자로 받아 출력한다. 만약 제네릭을 사용하지 않았다면 인자인 변수 i의 타입은 any가 되었거나, 가능한 모든 타입을 union을 통해서 엮어내야 한다. function printf(i: any)..
typeof는 기존 자바스크립트에서 이미 제공되는 문법이다. 타입스크립트에서도 역시 typeof를 사용할 수 있는데, 타입스크립트에서는 좀 더 확장된 기능들을 사용할 수 있다. 기본적인 문법은 자바스크립트와 크게 다르지 않다. // typescript v5.0.4 const str: string = "Hello type"; type Str = typeof str; // string 위와 같이 typeof로 타입을 타입 변수에 할당할 수 있다. 물론, 변수에 할당하지 않고도 곧바로 타입으로 지정할 수도 있다. // typescript v5.0.4 const str: string = "Hello type"; const hello: typeof str = "Hi"; 그리고 타입스크립트에서 typeof의 중요한..
타입스크립트는 클래스 문법에 대한 추가적인 지원이 있다. 따라서, 클래스를 작성할 때 타입스크립트는 자바스크립트와는 다른 문법을 사용하므로 이에 대해서 글을 남기도록 하였다. interface & type interface Bus { custommer: string[]; driver: string; callBus: () => string; getCustomer: () => string[]; onBoardBus: (custommer: string) => void; } 위와 같은 interface는 타입스크립트에서 객체의 타입을 표현하기 위해서 사용할 수 있다. 다만, java와 같은 객체지향 언어와 마찬가지로 interface를 implements하여 말 그대로 클래스의 인터페이스로 사용할 수 있다. cl..
타입스크립트에서 고정된 값을 주기위해서 다음과 같이 union을 활용할 수 있다. type Fruit = "Apple" | "Banana" | "Cocoa"; const fruit: Fruit = "Apple"; 위에서 fruit은 자동완성도 지원되고, Apple, Banana, Cocoa 셋 중 하나의 값만 가질 수 있게 된다. 다만, 다른 언어에 익숙한 사람이라면 enum을 사용하여 위의 고정된 선택지의 값을 표현하고 싶어할 수 있다. enum Fruit { Apple, Banana, Cocoa } const fruit: Fruit = Fruit.Apple; // 0 위의 타입스크립트는 다음과 같이 자바스크립트로 변환된다. "use strict"; var Fruit; (function (Fruit) ..
타입스크립트에서 타입을 선언하는데 크게 두 가지 방법이 있다. Type Aliases와 Interfaces에 대해서 정리하고, 각각 어느 상황에서 사용하는 것이 best case일지도 생각해보았다. Type type 키워드는 타입을 정의하기 위해서 모든 유형에 사용될 수 있다. 동일한 유형이 두 번이상 반복된다면, type을 선언하여 사용할 수 있다. type 키워드는 다음과 같은 특징을 지닌다. 객체를 포함한 모든 유형에 대한 타입을 표현할 수 있다. 문자열이나 숫자 등 값을 type에 할당할 수도 있다. type Name = string | undefined; let myName: Name; myName = "John"; type User = { nickname: string; level: numbe..