타입스크립트만의 독자적 타입 시스템 - 1

1. any 타입

자바스크립트에 존재하는 모든 값을 오류없이 받을 수 있다.

let state: any;

state = { value: 0 }; // 객체를 할당해도
state = 100; // 숫자를 할당해도
state = "hello world"; // 문자열을 할당해도
state.foo.bar = () => console.log("this is any type"); // 심지어 중첩 구조로 들어가 함수를 할당해도 문제없다

 

any타입을 변수에 할당하는 것은 지양해야할 패턴이지만 어쩔 수 없이 사용해야 할 때가 있다.

1. 개발 단계에서 임시로 값을 지정할 때
2. 어떤 값을 받아올지 또는 넘겨줄지 정할 수 없을 때
3. 값을 예측할 수 없을 때 암묵적으로 사용

 

2. unknown 타입

unknown 타입은 any 타입과 유사하게  모든 타입의 값이 할당될 수 있다. 그러나 any를 제외한 다른 타입으로 선언된 변수에는 unknown 타입값을 할당할 수 없다.

any	unknown
어떤 타입이든 any 타입에 할당 가능	어떤 타입이든 unknown 타입에 할당 가능
any 타입은 어떤 타입으로도 할당 가능 (never 제외)	unknown 타입은 any 타입 외에 다른 타입으로 할당 불가능

let unknownValue: unknown;

unknownValue = 100; // any 타입과 유사하게 숫자이든
unknownValue = "hello world"; // 문자열이든
unknownValue = () => console.log("this is any type"); // 함수이든상관없이할당이가능하지만

let someValue1: any = unknownValue; // (O) any 타입으로 선언된 변수를 제외한 다른 변수는 모두 할당이 불가
let someValue2: number = unknownValue; // (X)
let someValue3: string = unknownValue; // (X)

 

 

// 할당하는 시점에서는 에러가 발생하지 않음
const unknownFunction: unknown = () => console.log("this is unknown type");

// 하지만 실행 시에는 에러가 발생; Error: Object is of type 'unknown'.ts (2571)
unknownFunction();

 

 

 

3. void 타입

 

자바스크립트는 함수에서 명시적인 반환문을 작성하지 않으면 undefined가 반환된다. 

타입스크릡트는 void 타입이 사용되는데 이것은 undefined가 아니다. 타입스크릡트에서 함수가 값을 반환하지 않는 경우에 void를 지정하여 사용한다고 생각하면 된다.

function showModal(type: ModalType): void {
  feedbackSlice.actions.createModal(type);
}

// 화살표 함수로 작성 시
const showModal = (type: ModalType): void => {
  feedbackSlice.actions.createModal(type);
};

 

void 타입은 주로 함수 반환타입으로 사용되지만 함수에 국한된 타입은 아니다. 변수에도 할당할 수 있지만 함수가 아닌 값에 대해서는 대부분 무의미하다. void 타입으로 지정된 변수는 undefined 또는 null값만 할당할 수 있다.

 

let voidValue: void = undefined;

// strictNullChecks가 비활성화된 경우에 가능
voidValue = null;

 

일반적으로 함수 자체를 다른 함수의 인자로 전달하는 경우가 아니라면 void 타입은 잘 명시하지 않는 경향이 있다. 함수 내부에 별도 반환문이 없다면 타입스크립트 컴파일러가 알아서 타입을 void로 추론해주기 때문이다.

 

 

출처 - 우아한 타입스크립트 with 리액트