본문 바로가기

카테고리 없음

타입스크립트

타입스크립트란?

타입스크립트란 자바스크립트의 타입을 강제시키는 언어.

기존의 자바스크립트에서는 아래와 같이 변수에 문자열을 할당했다가 이후에 숫자열을 재할당해도 문제가 되지 않는다.

// 자바스크립트는 자료형에 연연하지 않고 할당이 가능합니다.
let hello = "hi"
hello = 12345

타입스크립트에서는 변수의 자료형을 지정해주기 때문에 재할당이 아래와같은 재할당이 불가능하다.

let hello:string = "hello" 

// 재할당이 문자열만 가능합니다.
hello = "12345"

브라우저는 HTML,CSS,Javascript만 읽을 수 있다. 타입스크립트를 읽는 방법은?

실행시에 자바스크립트로 변경되어 실행된다.

변경되는작업 : 컴파일 or 트랜스파일

변경해주는 도구: 컴파일러 or 트랜스파일러

컴파일 : 하나의 언어가 다른 언어로 변경되는 작업.

트랜스파일: 하나의 언어가 같은 언어의 다른 버전으로 변경되는 작업.

타입스크립트를 사용하는 이유

자바스크립트는 타입이 엄격하지 않다.

따라서, 변수나 상수를 만들면 처음에 문자를 넣었다가, 나중에 숫자를 넣는 등 자유자재로 변환이 가능하다.

이러한 점이 개발에는 굉장히 편리해 보이지만, 큰 서비스를 여러명이 개발하는 경우에는 문제가 될 수 있다.

따라서, 타입스크립트는 숫자 변수에는 숫자만 넣고, 문자 변수에는 문자만 넣도록 하여 안정성을 높여준다.

// 변수에 타입을 지정해주시면 됩니다.
let aaa : string = "안녕하세요"
let bbb : number = 123

객체 타입을 만들어줄때 네이밍에는 관례가 있습니다.

interface의 I와 변수명을 합쳐주는 것 입니다. 예를 들어 객체를 담은 변수 이름이 Profile이라면 타입을 지정하는 객체는 IProfile로 네이밍해주는 것 이 관례이다.

 

이렇게 타입스크립틑 이용해 각 변수에 타입을 지정해주시고 나면, 타입에 맞지 않는 값을 할당시 에러가 나게 된다.

 

타입추론

파일의 확장자를 ts 혹은 tsx로 변경하게 되면서 기존의 자바스크립트 작성 부분이 타입스크립트 영역으로 바뀌게 된다.

따라서 변수에 타입을 먼저 입히지 않고 할당을 하게되면 타입스크립트는 할당된 값의 자료형을 타입으로 추론 하게 된다.