티스토리 뷰

안희종님의 타입스크립트 입문서에서 예제를 가져왔습니다.(ahheejong.gitbook/io/ts-for-jsdev)

 

타입스크립트의 장점

타입 제공

function preferTypeScript(person) {
    return person.favoriteLanguages.includes('TypeScript')
}

플레인 자바스크립트로 코드를 쓰면 위와 같다. 위의 함수를 보고 예측할 수 있는 점은

  1. preferTypeScript라는 함수의 패러미터는 Object 형태이며, favoriteLanguages 라는 키를 갖는다. (닷노테이션으로 오브젝트 키에 접근하는 방식 사용)
  2. 그리고 favoriteLanguages 키는 배열을 값으로 갖는다. (배열 메서드인 includes 사용)
  3. 함수는 true나 false를 리턴할 것이다.

위 함수를 타입스크립트로 바꾸면

type Language = 'TypeScript' | 'JavaScript' | 'Python' | 'Rust' | 'Haskell';

interface Person {
    favoriteLanguage: Array<Language>;
}

function preferTypeScript(person: Person): boolean {
    return person.favoriteLanguages.includes('TypeScript');
}

타입스크립트를 사용하면서 자바스크립트 함수를 보고 추론해야됐던 내용들이 명확하게 코드로 드러나는 것을 알 수 있다.

preferTypeScript 함수의 패러미터가 favoriteLanguage라는 키를 갖는 오브젝트이며 그 키값은 Language라는 타입들로 이루어진 배열타입이라는 것이 interface로 확인되며, Language 타입에는 어떤 값이 있는지 미리 정의되어 있다. 또한 함수의 리턴값이 불리언이라는 것도 명시되고 있다.

 

인텔리센스(자동완성)

타입스크립트가 위와 같이 타입 안정성을 제공하기 때문에, 에디터 입장에서도 다음 코드를 예측하기가 쉬워진다. 예를 들어 특정 오브젝트가 가질 수 있는 인터페이스를 미리 정의했다면, 그 오브젝트의 키를 불러낼 때 가져올 수 있는 후보를 자동완성 기능으로 추천할 수 있게 된다.

'공부일지(TIL) > JavaScript' 카테고리의 다른 글

자바스크립트 this(재정리)  (0) 2019.10.12
자바스크립트 스코프(Scope)  (0) 2019.10.10
[TypeScript] 특징과 데이터 타입  (0) 2019.09.05
ES6 모듈 시스템  (0) 2019.08.09
프로미스의 활용  (0) 2019.08.07
댓글
공지사항
최근에 올라온 글
최근에 달린 댓글
Total
Today
Yesterday
링크
«   2024/12   »
1 2 3 4 5 6 7
8 9 10 11 12 13 14
15 16 17 18 19 20 21
22 23 24 25 26 27 28
29 30 31
글 보관함