TypeScript
타입스크립트(TypeScript)는 JavaScript의 확장판이라고 할 수 있다.
먼저 자바스크립트는 동적 타입 언어로 런타임은 빠르지만 타입 안정성이 보장되지 않는다는 단점이있다.
여기서 타입 안정성이란 우리가 아마 배워봤을 C, Java 같은 정적 타입 언어와 비교해보면 이해가 쉽다.
정적 언어는 변수를 선언하기 전 변수의 타입을 먼저 설정해준다는 공통점이 있다. 이에 반해 동적 언어인 자바스크립트는 변수를 선언할 때 스코프를 설정할 뿐 변수의 타입을 직접 설정해주진 않는다.이는 작성한 프로젝트가 커질수록 디버그를 하기 어렵게 만든다. 이런 단점을 보완해주는 것이 타입스크립트이다.
타입스크립트는 자바스크립트를 호환하면서 변수의 타입을 설정할 수 있다.
let a = '7';
a = 'string';기존 자바스크립트의 방식이 이렇다면
let a:number = 7;
a = 'string'; // 오류발생타입스크립트에서는 변수뒤에 콜론과 함께 타입을 지정해준다. number타입에 다른 타입의 값을 넣으면 오류가 발생한다.
TypeScript 기초 문법
타입스크립트가 자바스크립트의 상위에 있기 때문에 자바스크립트에는 없는 문법을 위주로 다룰 것이다.
타입지정
- 변수, 함수의 인자, 함수의 반환값에 타입을 지정할 수 있음
- 타입을 명시하지 않으면 값이 처음 할당될 때 모든 타입 허용(any타입)
- But, any타입 사용을 남발하면 TypeScript를 사용하는 의미가 퇴색되므로 사용 시 주의해서 사용해야 함
function test(name : string = "이정우", age? : number) : number{
...
};위와 같이 인자값 그리고 반환값의 타입을 지정할 수 있다.
age옆에 ?는 옵션 인자로 생략가능한 인자이다. 주의할 점은 옵션인자를 마지막으로 써야 한다는 것! 자바스크립트 에서도 기본 값을 인자로 줄 때 마지막으로 줘야하는 것과 마찬가지 일 것이다.
클래스
- 자바스크립트에는 존재하지 않는 접근제어자(public, protectd, private)가 존재 (기본 값은 public)
- 이외에도 readonly라는 특별한 접근 제어자가 있음. 이름에서 알 수 있듯 읽기만 가능한 프로퍼티를 선언할 때 사용
class Person{
readonly private audit : string;
static count : number;
constructor( public name : string, public age : number, private audit : string)
{
...
}
getName():string {
return this.name;
}
};- 기존 자바스크립트에서는 메소드에만 static을 쓸 수 있었지만 타입스크립트는 프로퍼티에서 사용가능
- 이외 다른 변경사항도 있지만 추후에 다루기로 하고 다음으로 넘어가겠음
Interface
- 인터페이스는 여러 가지 자료형의 타입을 정의하는 용도로 사용 (객체에서)
interface Person {
name : string;
age? : number;
}
const p: Person = {
name: '이정우',
age: 23,
}이런식으로 사용할 수 있고 인터페이스를 확장 또는 두 인터페이스를 합칠 수도 있다.
인터페이스와 타입을 구분짓는 것은 인터페이스는 선언 병합이 가능하지만, 타입은 그렇지 않다는 것이다.
자세한 건 찾아보는 것도 좋을 것 같다. 여기서는 어떻게 사용하는지 정도만!