본문 바로가기
FE/TypeScript

[TypeScript] 기본 타입

by 백승전 2022. 9. 14.

 

설치

 

# 기본
npm install -g typescript

# 리액트에서 설치 시
# 신규 프로젝트
npx create-react-app 프로젝트명 --template typescript

# 기존 프로젝트
npm install --save typescript @types/node @types/react @types/react-dom @types/jest

 

문자형, 숫자형 타입

 

 

이미지와 같이, 문자형에는 :string을, 숫자엔 :number을 작성해 줘야 합니다.

당연히 string으로 타입을 지정해 줬는데, 숫자가, number로 타입 지정을 해 줬는데 문자가 들어가면 에러가 발생하게 됩니다.

 

boolean 타입

 

 

객체 타입

 

 

객체의 경우는, 객체를 그대로 복사하여 사용하면 됩니다.

이게 너무 길 경우, 후에 type alias나 interface로 정의하여 사용하면 훨씬 코드가 간결해집니다.

 

배열 타입

 

배열도 union 가능

 

union은 타입을 여러 개 이상 지정해줄 수 있는 문법입니다.

이는 다음 포스팅에서 다루도록 하겠습니다.

 

함수 타입

 

function sum(a: number, b: number): number {
  return a + b;
}

sum(10, 10) // 20
sum(10, 'hi') // error
sum(10, 10, 10) // error

 

함수도 똑같이 매개변수와 return 값에 타입을 지정해 주면 됩니다.

당연하게도, 매개변수에 지정해준 타입이 아닌 매개변수가 입력되면, return에 지정 외 타입이 출력되면 에러가 발생하게 됩니다.

'FE > TypeScript' 카테고리의 다른 글

[TypeScript] Class  (0) 2022.09.14
[TypeScript] 그 외 타입  (0) 2022.09.14
[TypeScript] Type Alias, Interface  (0) 2022.09.14

댓글