🍏

2. 타입시스템

타입스크립트의 타입 시스템

타입스크립트는 타입을 정확히 명시해줘도 되고, 자바스크립트처럼 명시하지 않아도 된다. (이것이 타입스크립트의 타입추론)

a를 처음 문자열로 초기화 ⇒ a를 String 이라고 추론한다.

따라서 a를 다른 문자열로 변경하는 것은 가능하지만 숫자로 변경할 때 오류가 났다.

타입스크립트에서 타입을 명시하는 방법!

c가 number 배열이라는 것을 추론하고 문자가 들어가지 못하도록 막아주었다!!

타입을 추론하지 못할 것 같을 때 타입을 명시해주는 것이 좋다.

명시적 표현은 최소한으로 사용하는게 좋다!! (Typescript가 추론하게 하는게 더 낫다.)

모두 타입추론 때문에 발생하는 오류!

const player : {
    name : string,
    age : number
} = {
    name: "sun"
}
// age가 없어서 오류가 난다.
TypeScript
복사

?를 넣어서 바꾼다면

const player : {
    name : string,
    age ?: number
} = {
    name: "sun"
}
// age는 number 이거나 undefined라고 명시했다. => 오류가 나지 않는다!!
TypeScript
복사

player.age가 undefined인 상태에서

if(player.age < 10) {

}
TypeScript
복사

라고 코드를 작성하면 오류가 난다.

undefined라고 오류가 나네 개발자를 보호해주네

const player1 : {
    name : string,
    age ?: number
} = {
    name: "sun"
}

const player2 : {
    name : string,
    age ?: number
} = {
    name: "yuijung"
}
TypeScript
복사

위의 코드처럼 타입이 같다면 (코드가 중복된다면)

type Player = {
    name:Name,
    age?:Age
}

const player1 : Player = {
    name: "sun"
}

const player2 : Player = {
    name: "yuijung"
}
TypeScript
복사

이렇게 타입을 지정하여 사용할 수도 있음 ⇒ 코드재사용

type Age = number;
type Name = string;
type Player = {
    name:Name,
    age?:Age
}

// 인수의 타입을 명시, return 타입을 명시
function playerMaker(name:string) : Player{
    return {
        name
    }
}

const sun = playerMaker("sun")
sun.age = 1 // playerMaker 함수의 타입을 명시해주지 않았다면 오류발생
TypeScript
복사

playerMaker함수를 화살표함수로 변경한다면

const playerMaker = (name:string) : Player => ({name})
TypeScript
복사

readonly 설정

타입스크립트에서는 readonly 속성을 설정할 수 있다. readonly를 설정하면 값을 변경할 수 없다.

name에 readonly 속성을 부여했기 때문에 값 수정 불가

배열에 readonly를 설정하면 값을 push 할 수 없다.

filter나 map 사용은 가능하다. 이것들은 배열을 바꾸지 않기 때문이다.

Tuple

튜플이란? 길이와 타입이 고정된 배열!!

player[0] 이 string 이라는 것을 알고 있기 때문에 오류

튜플과 readonly를 같이 쓴다면?

readonly tuple

[readonly tuple] string으로 값을 변경해도 수정 불가!!

undefined, null, any

undefined, null 은 타입스크립트의 타입이자 자바스크립트의 타입

타입스크립트의 타입 any

any는 비어있는 값의 기본 타입

any를 사용하지 않는 것을 권장한다. any를 사용한다면 타입스크립트를 사용하는 의미가 없어진다. 타입스크립트의 보호장치가 사라진다. (==자바스크립트로 돌아가고시펑?!?!)

예를 들면,

이러한 코드가 아무 문제도 발생하지 않고 정상적으로 작동된다.

any 를 지운다면

타입스크립트는 이를 허용하지 않아.

하지만 any를 사용해야 할 때도 있다고 한다.

타입스크립트만의 타입 unknown!!

변수의 타입을 미리 알지 못할때 사용한다. 예를 들면 API로 리턴받는 값의 타입을 알 수 없을때 사용한다.

a의 타입을 unknown으로 선언했기 때문에 숫자를 더할 수 없다.

그럴 때는 a의 타입을 검사해준다. a의 타입이 number인 것을 확인 후 숫자를 더하면 오류가 나지 않는다.

toUpperCase 사용도 마찬가지로 타입이 string인지 검사를 해주어야 한다.

void

타입을 지정하지 않은, 아무것도 return 하지 않는 함수는 void 타입이다.

never

never 타입은 절대 return 하지 않는다.

오류 발생

리턴 하지 않고 오류를 발생시키는 함수

또, never는 변수의 타입이 두가지 일 수도 있는 상황에 발생한다.

name의 타입이 string 혹은 number인 상황에서 타입을 검사했는데 둘 다 아닌 경우(else)에 name의 타입이 never가 된다. (else문에 있는 코드가 절대 실행되면 안된다는 말과 같다.)

⇒ 제대로 된 타입의 인자가 들어왔다면 else는 실행되지 않을 것이다.