[Typescript] 타입스크립트 시작하기

 

 

타입스크립트란 자바스크립트의 ES6 문법과 새로운 버전으로 나오는 ES Next에 타입(Type)기능을 추가한 것이다.

 

타입스크립트는 마이크로소프트에서 오픈소스 프로그래밍언어로 개발되었다.

 

타입 기능이 필요한 이유는 여러 사람이나 팀이 협력할 때 코드를 서로 만들다가 오류가 발생할때,

 

어떤 부분이 오류가 났는지 찾는 것이 어렵다. 

 

타입기능을 구현하면 문제의 원인이 어디있는지 수월하게 찾아서 오류를 수정할 수 있다.

 

이번 포스팅에서는 간단한 타입스크립트 문법에 대해 설명할 것이다.

 

 

---

타입스크립트 고유문법

 

1) 타입 주석과 타입 추론

 

타입주석은 변수 n뒤에 콜로(:)과 타입을 적는 것이다.

 

let n : number = 1
let m = 2

그리고 두번째에 적힌 부분을 보면,

 

타입 주석 없이 변수의 타입 부분이 생략되어 대입 연산자(=)의 오른쪽 값을 분석하여 변수의 타입을 결정하는 것인데, 이는 타입 추론이다.

 

.js파일 확장자를 .ts 확장자로 바꿔 타입스크립트 환경에서도 바록 작동되게 해준다.

 

2) 인터페이스

 

인터페이스 구문에 타입을 넣어준다.

 

interface Person {
	name: string
    age?: number
}

let person : Person = { name : 'Kim' }

 

3) 튜플

 

튜플은 배열과 같아 보이지만, 데이터 타입이 모르 다른 것이 튜플이다.

 

let stringArr : string[ ] = ['a', 'b', 'c'] // 배열

let tuple : [boolean, number, string] = [false, 24, 'as'] // 튜플

 

4) 제네릭 타입

 

제네릭 타입은 다양한 타입을 한꺼번에 취급하게 해준다.

 

아래 Container 클래스에서 value속성을 포함한다.

 

class Container<T> {
	constructor(public value: T) { }
}

let numberCon : Container<number> = new Container<number>(2)
let stringCon : Container<string> = new Container<string>('Hello')
let numArrCon : Container<number[]> = new Container<number[]>([2, 4, 6])
let booleanCon : Container<boolean> = new Container<boolean>(true)

위와 같이 여러가지 타입을 대상ㅇ느로 동작할 수 있다.

 

5) 대수 타입

 

대수타입이란, 다른 자료형의 값을 가지는 자료형을 의미한다.

 

크게 합집합 타입(union or sum type)과 교집합 타입(intersection or product type) 두가지가 있다.

 

type NumberOrString = number | string;
type AnimalAndPerson = Animal & Person;

 

이렇게 간단하게 타입스크립트가 무엇인지에 대해 알아보았다.

 

다음에는 좀더 깊숙하게 객체와 타입에 대해 알아볼 예정이다.