TypeScript any 타입, 클래스 타입, 제네릭 타입 예제

any 타입은 어떠한 타입도 대입할 수 있는 타입입니다.

any 타입을 가진 값은 어떠한 타입과도 호환 가능합니다.

const a: any = 3;
const b: string = a;

 

변수 a는 any 타입 변수이기 때문에 어떠한 값을 대입해도 상관없습니다.

그리고 any 타입의 값은 어떠한 형태의 타입으로도 이용 가능하기 때문에 string 타입의 변수 b에도 대입할 수 있습니다.

편리하게 생각할 수 있지만, 생각해보면 TypeScript의 규칙을 전부 무시하는 것이 됩니다.

그렇기 때문에 any 타입은 정말 부득이한 경우가 아니라면 사용하지 않는 것이 좋다고 생각합니다.

 

클래스 타입

최근의 JavaScript에는 클래스를 정의해서 사용하기도 합니다.

TypeScript에서는 클래스를 정의하는 동시에 타입도 정의 됩니다.

class Foo {
	method(): void {
		console.log('Hello, world!');
	}
}

const obj: Foo = new Foo();

 

클래스 Foo를 정의한 것으로 Foo라는 타입도 동시에 정의 되었습니다.

Foo라는 것은 클래스 Foo 인스턴스 타입입니다.

 

제네릭

타입을 가지고 있는 언어에는 제네릭이라는 것을 가지고 있는 경우가 많습니다.

TypeScript에도 제네릭이 있습니다.

작성 방법은 Foo<S, T> 처럼 작성합니다.

즉, < >안에 타입을 정의해주는 것입니다.


interface Foo<S, T> {
	foo: S;
	bar: T;
}

const obj: Foo<number, string> = {
	foo: 3,
	bar: 'hi',
};

 

Foo는 S와 T 라는 2개의 타입을 가지고 있습니다.

Foo를 사용하기 위해서는 S와 T에 해당하는 타입을 Foo<number, string> 처럼 지정해야 합니다.

그외에도 클래스나 함수를 정의할때도 사용할 수 있습니다.

class Foo<T> {
    constructor(obj: T) {

    }
}

const obj1 = new Foo<string>('foo');
function func<T>(obj: T): void {
    
}

func<number>(3);

 

생략하지 않는다면 (obj: T)=> void 라는 형태가 됩니다.

function func(obj: T): void {

}

const f: (obj: T)=> void = func;

 

함수 경우에는 호출되기 전까지 어떤 타입의 파라미터로 호출될지 모르기 때문에 타입 변수가 남겨져 있는 상태가 됩니다.

아래 예제는 identity는 타입 변수 T를 가지고 있지만 identity를 호출하는측에서는 타입 변수 T를 생략 하고 있습니다.

function identity<T>(value: T): T {

    return value;

}

const value = identity(3);

// 에러: Type '3' is not assignable to type 'string'.

const str: string = value;

 

이러한 경우에는 파라미터 정보에서 T를 추론하게됩니다.

실제 파라미터 값으로 지정한 3이란 값으로 타입 변수 T는 3이라는 값에서 형추론을 하게 됩니다.

변수 value 타입은 3이 되고,3타입의 값은 string 타입을 가진 변수에 대입할 수 없기 때문에 에러가 발생합니다.

타입 변수 T에 의해 올바르게 형추론이 발생한 것을 확인 할 수 있습니다.

단 복작한 처리를 하는 경우에는 타입 변수가 올바르게 형추론을 하지 못하는 경우도 있으니 주의해야 합니다.

댓글