타입스크립트 타입

number, string, boolean, null, undefined, object, array, enum의 타입이 있다.

number, string, boolean

자바스크립트와 타입스크립트에는 int, float, double 같은 형이 없고 다 number 형을 쓴다.

그리고 char형도 없다 한글자를 표현하든 여러 글자를 표현하든 다 string형으로 표현할 수 있다.

boolean형은 true와 false를 표현하는 타입이다.

let num: number = 123; // number타입 선언
let str: string = "문자열 입니다."; // string 타입 선언
let bool: boolean = true; // boolean 타입 선언

num = "str"; // number 타입에 string 타입을 넣으려고 하면 에러
str = 123; // 타입이 다른 값을 대입하려고 하면 에러
bool = "gggg";

array

array 타입을 그냥

const array = [];

로 설정하게 되면 any[]라고 된다. 아무 값이나 넣을 수 있는 배열이 된다.

any는 모든 타입의 슈퍼타입이며 모든 것을 포함 할 수 있기 때문에 좋은 타입이라고 생각하기 쉽지만 js랑 다른게 없게 된다. 그래서 any 타입은 정말 어떤 타입이 올지 알 수 없을 때가 아니면 사용을 최대한 지양해야한다.

배열 안에 어떤 값들이 들어갈지를 알면 그 타입을 지정해주면 된다

const array: string[] = [];
const array1: number[] = [];
const array2: boolean[] = [];

그리고 나서 string 배열이나 number 배열에 다른 타입의 값을 넣으려고 하면 에러가 난다.

array.push(1) // string[]에 number를 넣으려고해서 에러가 뜬다.

해당 타입에 맞는 값을 넣어줘야한다.

const array: string[] = [];
const array1: number[] = [];
const array2: boolean[] = [];

array.push("1"); // string 값을 넣어주면 에러가 나지 않는다.

그리고 나서 npx tsc를 하면 dist 폴더에 test.js 파일이 생성된다.

dist/test.js

"use strict";
var array = [];
var array1 = [];
var array2 = [];
array.push("1");

tuple

튜플은 원소의 수와 각 원소의 타입이 정확히 지정된 배열이다.
튜플 타입 변수는 정확히 명시된 개수 만큼의 원소만을 가질 수 있다

const tuple: [string, number] = ['김준수', 27, 4]; // 원소의 개수가 달라 에러가 난다.
let tuple1: [string, number] = ['김준수', 27]; // 에러가 안 남.

tuple1 = [123,"123"]; // 타입 순서가 맞지 않아 에러가 남.

다만 튜플 타입의 값을 Array 프로토타입의 메소드를 통해 조작하는 것은 금지되지 않는다는 점에 유의해야 한다.

const tuple: [string, number] = ['김준수', 27];
tuple.push(1); // 에러가 안 남.

object

const obj: object = {
    name: '문건우',
    role: '학생',
}

그러나 제대로 타입 체킹이 되게 하려면 object 말고 정확한 키: 타입 값을 적어주는게 좋다.

const obj: {
    name: string,
    role: string
} = {
    name: '김준수',
    role: '학생',
}

이런식으로하면 객체안의 속성 체크가 제대로 이뤄지는 것을 알 수 있다.