#2 TypeScript 타입의 종류

타입

 ts는 js에서 변수, 매개변수, 함수 리턴값에 타입을 정해주면 된다.

const a: number = 111; 

const b: string = 'hello';

const c: boolean = true;

const d: undefined = undefined;

const e: null = null;

const f: any = 'any'; // 모든 타입 가능

const g: 10 = 10 // 타입 자리에 받고 싶은 값을 지정 할 수 있다. 다른 값이 올시 에러

const h: never; // never라는 타입은 불가능을 나타내는 타입이다.


const arr: string[] = ['aaa', 'bbb'];

const arr2: Array<number> = ['aaa', 'bbb'];

const arr3: [number, string, boolean] = [111, 'aaa', false];

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, lon: number } = { lat: 37.5,lon: 127.5};

Unknown

unknown은 타입을 아직 정해지 못했을 때 사용하는 타입으로, {} | null | undefined이다. ( "|"은 union으로 #3에서 설명한다.

 

let Unknown: unknown = 123;
Unknown = 'string';
Unknown = true;

위 코드들은 모두 에러가 발생하지 않는다.

그렇다면 any와 차이점은 뭘까?

interface len {
    length: 100;
}

const n: len = {
    length: 100
}

const b: unknown = n;

console.log(b.length);  // 1번 
console.log((b as len).length); // 2번

다음에서 1번 오류가 발생하고 2번은 오류가 발생하지 않는다.

이것이 any와의 차이 점이다. unknown타입은 len 타입이 아니기 때문에 타입 검사에서 오류가 나게 되는 것이다. unknown은 타입이 아직 정해지지 않았을 때 사용하기 때문에 2번처럼 타입 단언을 이용할 수 있으며, 단언을 통해 len으로 확언한다면 동작이 가능해지게 된다.

 

타입 단언은 여기서 배울 수 있다. 

[Language/TypeScript] - #4 TypeScript 타입 추론(Inference), 단언(Assertion)

 

object, {}, Object

object는 원시 값이 아닌 모든 값을 지칭한다. 또 {}과는 다르고 Object과도 다르다.

{}과 Object는 null 과 undefined를 제외한 타입 가능하다.

Enum

const enum EDirection = {
    Up = 3,
    Down,
    Left,
    Right
}

const Direction = {
    Up: 3,
    Down: 4,
    Left: 5,
    Right: 6
} as const

위 enum의 Down 은 4 Left는 5 Right는 6의 값을 가진다.

 

enum 대신 아래 객체를 이용할 수도 있다.

 

function speakWay(dir: EDirection){
    console.log(dir);
}

speakWay(EDirection.Left);

type Direction = typeof ODirection[keyof typeof ODirection];

function sayWay(dir: Direction){
    console.log(dir);
}

sayWay(ODirection.Left);

enum은 타입으로 그대로 사용할 수 있다.

 

객체를 타입으로 사용하고 싶다면 7번째 줄의 코드를 사용해야 하는데

 

#3 TypeScript 타입의 생성

이 글의 keyof, typeof에서 설명하고 있다.

 

void

 

void는 2가지 의미로 사용된다.

1. 반환값이 존재하지 않는다.

2. 반환값이 무시된다.

function a(callback: () => void): void{
    return;
    // return undefined;
}

a(() => {
    return 'result';
 })
 
interface Human {
    talk: () => void;
}

const human: Human = {
    talk() { return 'result'}
}

 

void는 매개변수(parameter), 리터럴 함수의 return 타입, 메서드(method)에 사용할 수 있다.

 

기본적으로 리터럴 함수의 return타입인 void는 1번의 의미를 가지며, 반환하지 않는 함수는 암묵적으로 undefined 값을 반환한다. (하지만 void != undefined 이다.)

 

일반적이지는 않지만 매개변수와 method에서 void는 아무것도 return 하지 않도록 강제하지 않는다. 즉, 에러가 아니다. 하지만 반환된 값은 무시된다. 즉, 2번의 의미이다.

 

주의할 점으로 리터럴 함수 정의가 void 타입을 반환하게 설정한다며, 어떤 반환값도 가져서는 안 된다.

function noTalk(): void {
    return 'noTalk';
}

따라서, 위 코드는 에러가 나게 된다.

 

Class

ts에서 class는 그 자체로 타입이 될 수 있다.

class A {
    a: number;
}

class B {
    b: string;
}

function aOrB(arg: A | typeof B) {
}

aOrB(A); // error
aOrB(new A());
aOrB(b);

aOrB의 arg처럼 class A가 바로 타입으로 들어간다면, new A()를 지칭하는 것이다.

 

클래스 자체를 타입으로 쓰고 싶다면 "typeof"를 사용하면 된다.

https://www.typescriptlang.org/ko/docs/handbook/2/functions.html
https://stackoverflow.com/questions/49464634/difference-between-object-and-object-in-typescript