[TypeScript] 기본 타입

2021년 09월 13일

타입스크립트 기본 타입

타입스크립트는 변수를 만들때 타입 지정이 가능하다.

변수명 : 타입

// 자주 사용하는 primitive Type
let person: string = "choi"; // string 타입 지정
let age: number = 27; //숫자형
let isMarried: boolean = false; // boolean형

타입을 지정했는데 만약 변수에 다른 타입을 할당하려 하면 오류가 발생한다.

person = 123; // Type 'person' is not assignable to type 'string'.

이외에도 null, undefined type 존재한다.

배열과 객체도 타입 지정이 가능하며, 그 안에 들어갈 데이터들도 타입 지정 가능하다.

let members: string[] = ["cho", "choi"]; // 배열 안에는 string type의 데이터들만 들어간다.
let info: { age: number } = { age: 20 }; // 객체 안에 들어갈 'age'의 type을 number로 지정

변수 생성시 타입을 지정하지 않아도 타입스크립트가 자동으로 타입을 지정해주니 간단한 변수들은 타입 지정을 생략하는게 좋다.

타입을 미리 정하기 애매할때는 union type, any, unknown 을 사용한다.

Union

만약 어떤 변수에 number나 string이 들어올 수도 있을때 ’ | ’ 연산자를 사용한다.

// string 또는 number 타입만 들어오게 하려면
let user: string | number = "choi";
let age: string | number = 12345;

// array나 object에 string 또는 number가 들어오게 하려면
let arr: (number | string)[] = [1, "2", 3];
let obj: { data: number | string } = { data: "123" };

any

어떤 값이든 할당할 수 있는 타입

any 타입은 타입 체크 해제(?) 문법이기 때문에 갑자기 타입을 마구 바꿔도 에러가 나지 않는다.

타입관련 버그가 생길 경우 왜 그런지 추적하기 어렵기 때문에 막 쓰면 안된다.

비상시 쓰는 변수 타입체크 해제기능 이런 용도로 사용할 것

변수 선언과 초기화 과정에서 타입을 할당하지 않으면 암시적으로 any 타입이 지정된다.

// 명시적으로 any 타입 지정
let product_id: any = 124981;

// any 타입이 설정되었으므로 어떤 유형도 값으로 할당 가능
product_id = "ppp123";

unknown

any와 똑같이 어떤 값이든 집어넣을 수 있다.

아직 어떤 타입이 들어올지 모를 경우, 다양한 타입을 집어 넣어야할 경우 이걸 사용한다.

1. unknown 타입엔 모든 데이터를 다 집어넣을 수 있음

2. 데이터를 집어넣어도 타입은 그대로 unknown

let variable: unknown;

variable = true; // OK (boolean)
variable = 1; // OK (number)
variable = "string"; // OK (string)
variable = {}; // OK (object)

그런데 unknown 타입으로 선언된 변수는 오직 any 타입으로 선언된 변수에만 할당될 수 있다.

let foo: unknown;

let f1: string = foo; // Fail
let f2: boolean = foo; // Fail
let f3: number = foo; // Fail

또한 unknown 타입으로 선언된 변수는 알려지지 않은 타입이기 때문에 프로퍼티에 접근하거나, 메서드를 호출하거나 인스턴스를 생성하는 것이 불가능하다.

let person: unknown;

person.name; // Error
person[0]; // Error
new person(); // Error