teklog

TypeScript 입문하기 2 - Types

2022/09/05

n°3

category : TypeScript

** migrated from old blog


Types & Optional Type & Union Type


Types


Typescript에서 정해진 타입은 다음과 같다.



  • Number
  • String
  • Object
  • Array
  • Boolean
  • Null
  • Undefined
  • Tuple
  • Enum
  • Any
  • Void
  • Never


왼쪽은 기본적은 자바스크립트의 데이터타입과 동일하다. (문자, 숫자, 배열, 불리언, 객체, null...)

오른쪽은 TS에만 있는 타입들이다.


Tuple

Array의 특정한 길이, 위치(순서) , 타입을 요구한다.

타입이 Tuple로 정의된 배열은 반드시 동일한 순서와 길이를 따라야 한다.



const EXP : [string, number, boolean] = ['str', 123, false]
// or

type TupleType = [string, number, boolean] 
const EXP2 : TupleType = ['str', 123, false]

//error case
const EXP3 : TupleType = ['str', 123, false, 'add']
EXP2.push(2) // error, 튜플에서 배열의 길이와 순서에 따른 타입이 모두 정해졌기 때문에.

Enum → pass


Unknown : 컴파일 에러에서 검출되는 any 타입

어떤 타입일 지 알 수 없는 변수에 사용되는 타입.

any 타입과 거의 유사하지만, 컴파일에서 타입 에러를 걸러낼 수 있다.

함수에서 매개변수에 unknown 타입을 지정해준 뒤, 함수 내부에서 타입을 좁혀서 사용할 수 있다.



const PrintThis = (a: unknown) => {
if (typeof a === 'string')
{
	console.log( `${a} is string`)
}
if (typeof a === 'number') {return a + 2}
return a[0];
}

PrintThis({age : 12});
// 컴파일 에러 

만일 매개변수 a에 **any**타입이 지정되어 있었다면, 타입 검증이 일어나지 않지만 unknown 타입이 지정되어 있다면 컴파일에서 타입 검증이 일어난다.


Void

주로 아무것도 return 하지 않는 함수의 타입을 지정할 때 사용된다.


Never

절대로 끝에 도달하지 않는 함수의 타입을 지정할 때 사용되는 타입.

ex ) return 하지 않고 Error를 throw하는 함수



function neverEnd(): never {
  while (true) {
	.....
  }
}


Any

모든 타입을 허용하게 하는 타입. === Typescript를 무효화시키는 타입과 동일하여서, 최대한 사용을 자제하는 것이 좋다.


Optional Type

객체(함수)의 타입을 지정할 때 특정한 키를 nullable하게 지정할 수 있다.



const Player : { 
name : string, 
age?:number 
// 물음표는 age : number | undefined 와 동일한 의미이다.
} 
= {name : "good"}


Union Type

데이터의 타입이 A 이거나 B 일 수 있다면, 이는 유니언 타입Union Type이다.



const Player : {
name : string,
profile : string | number 
// profile은 union 타입이다.
}