변수 선언

자바스크립트와 타입스크립트의 변수 선언은 비슷하다.
차이점이라면 대입 연산자 앞에 :[type]으로 타입을 지정해준다는 점이다.

// JavaScript 변수 선언
let num = 10
const str = "hello javascript"

// TypeScript 변수 선언
let num: number = 10
const str: string = "hello typescript"

타입 지정을 하지 않아도 변수 선언을 할 때 값을 할당하면 타입스크립트가 알아서 타입을 추론해 타입을 지정해준다.

// TypeScript의 타입 추론
let num = 10
const str = "hello typescript"

위와 같이 JavaScript 변수 선언 같이 사용해도 문제는 없다.

let num
num = 10

위와 같이 변수 선언 시 초기화를 해주지 않으면 타입이 any로 지정되기 때문에 초기 값을 지정하지 않는다면 타입을 지정해줘야 한다.

기본 타입

숫자형(Number)

let num: number = 10
let float: number = 3.14
let nan: number = NaN
let infinity: number = Infinity
let hex: number = 0x5f
let octal: number = 0o137
let binary: number = 0b1010

문자열(String)

let str: string = "hello world"
let str2: string = "10"

불리언(Boolean)

let bool: boolean = true
let bool2: boolean = false

Null & Undefined

let nullValue: null = null
let undefinedValue: undefined = undefined

null과 undefined는 모든 타입의 하위 타입이다.
하위 타입은 상위 타입으로 정의된 변수에 할당이 가능하다.
만약 strictNullChecks 가 false로 설정되어 있으면 아래와 같이 할당이 가능하다.
(strictNullChecks가 true로 설정되어 있으면 null과 undefined는 any와 각자 자신들의 타입에만 할당이 가능하다.)

let numValue:number = 10
numValue = null
numValue = undefined

위와 같이 numValue의 타입은 number로 지정했지만 undefined와 null은 모든 타입의 하위 타입이기 때문에 할당이 가능하다.

배열(Array)

let numList: number[] = [1, 2, 3]
let strList: string[] = ["h","e","l","l","o"]

튜플(Tuple)

let tuple: [string, number] = ["hello", 1]

Enum

기본적으로 enum은 0부터 시작해 열거된 멤버들에 번호를 매긴다.

enum Color { 
  Red, // 0
  Green, // 1
  Blue // 2
}
let display: Color = Color.Red // 0
display = Color.Green // 1
display = Color.Blue // 2

멤버의 값을 수동으로 설정하여 바꿀 수 있다.

enum Color { Red = 1, Green = 2, Blue = "Five"}
let display: Color = Color.Blue // Five

console.log(Color)
// { '1': 'Red', '2': 'Green', '5': 'Blue', Red: 1, Green: 2, Blue: 5 }

매겨진 값을 이용해 enum 멤버의 이름을 알아낼 수도 있다.

enum Color { Red = 1, Green = 2, Blue = "Five"}
let num: number = Color[2] // Green
// let str: string = Color["Five"]
// error TS7015: Element implicitly has an 'any' type because index expression is not of type 'number'

Any

어떤 타입이든 할당할 수 있다.
하지만 그 타입이 무엇인지 알 수 없기 때문에 타입 안정성이 보장이 되지 않는다.
쓰지 않는 걸 권장한다.

let anyValue: any
anyValue = 1
anyValue = "10"
anyValue = true
anyValue = undefined
anyValue = null
anyValue = {}

any 타입은 모든 타입의 상위 타입이기 때문에 모든 타입을 할당 가능하다.

하위 타입과 상위 타입

하위 타입은 상위 타입으로 정의된 변수에 할당이 가능하다.
null과 undefined는 number의 하위 타입이므로 null과 undefined 타입의 값은 number 타입의 변수에 할당할 수 있다.
any 타입은 모든 타입의 상위 타입이기 때문에 모든 타입의 값을 할당 가능하다.

unknown

any 타입과 유사하지만 unknown 타입은 더욱 엄격하게 타입을 검사한다.
unknown 타입을 사용하면 어떤 값이든 할당이 가능하나 다른 타입의 변수나 매개변수에 할당하기 위해서는 반드시 타입 검사를 수행해야 한다.

const getValue = (value: unknown): string => {
  if (typeof value === "string") return value
  return ""
}

const fn = getValue(1)

unknown 타입이 모든 타입의 상위 타입이기 때문에 다른 타입으로 변환하기 전에 해당 값이 올바른 타입인지 검사해야 한다.

let x: unknown = "hello";
let y: string;

if (typeof x === "string") { 
  // typeof 연산자를 사용하여 x 변수의 타입을 검사
  y = x; // x 변수를 string 타입의 변수에 할당
}

Void

함수의 반환값으로 사용될 수 있는 타입 중 하나이다.
반환값이 없음을 나타내는 타입으로 일반적으로 함수가 어떤 결과를 반환하지 않는 경우에 사용한다.

const print = (str: string): void => {
	console.log(str)
}

print("hello world")

Never

함수의 반환값으로 사용될 수 있는 타입 중 하나이다.
함수가 정상적으로 반환되지 않거나 무한 루프에 빠져서 종료되지 않는 경우에 사용된다.

const throwErr = (message: string): never => {
	throw new Error(message)
}

const loop = (): never => {
  while (true) {
    console.log("loop")
  }
}

Object

object 타입은 거의 사용하지 않는다.

const obj: object = {}
const arr: object = []
const func: object = () => {}

참고

https://typescript-kr.github.io/pages/basic-types.html#%EC%88%AB%EC%9E%90-number
https://itchallenger.tistory.com/447