타입스크립트(Type Script) 데이터 타입, 예제

컴파일 언어, 인터프리터 언어 차이점 : 컴파일 언어는 타입을 가지고 있다.
인터프리트 언어의 경우 개발할 때 타입체킹(Type Checking) 없기 때문에 코드 작성 후 에러나면 디버깅이 굉장히 어렵다.
SPA의 경우 한 페이지에서 서비스를 수행한다. 따라서 코드 작성 후 루틴 중 에러가 난다면 처음부터 다시 해야 하는 경우가 빈번하다. 따라서 코드 작성시 에러를 줄이도록 하는 노력이 필요했고, 이를 충족시키기 위한 언어가 타입스크립트(TypeScript)이다. 자바스크립트를 발전시킨 언어로 자바스크립트에서 타입을 구분할 수 있도록 되었다는 점이 가장 큰 차이점중 하나다. 코드 작성시 에러를 파악하고 디버깅이 용이하다는 점이 자바스크립트와 비교할 때 두드러지는 강점이다. 자바스크립트에서 파생된 언어이기 때문에 자바스크립트의 모든 문법 또한 사용 가능하다.

등장 배경
빅데이터 처리시 객체지향만으로는 속도 한계가 보였음(반복문 등 ng 구문들도 같은 반복문같은데 성능에 차이가 있다는 점은 아직 와닿지 않는다.) 
속도 빠른 함수 지향 패러다임 재조명 But 반복문을 대체하는 것이 굉장히 난해하다.(맵리듀스를 비롯)

타입스크립트 홈페이지 접속한다.

http://www.typescriptlang.org/

다운로드 클릭하면

Npm 명령어를 통해 설치하라고 한다. 이는 Node가 필요하다는 것이다.(npm이 Node Package Manager의 약어

vs code 임의의 폴더 생성 후 터미널에 명령어 입력한다. 
npm install -g typescript 
(Global) 옵션 통해 전역 설치.

타입스크립트와 Angular 함께 사용하기 위해 타이핑스(Typings) 필요
타이핑스 : Angular에서 필요한 TypeScript 설정 객체

폴더에서 let.ts 파일 생성 후 다음과 같이 코드 작성.
기존 자바스크립트 코드이다.
vs code의 경우 컴파일시 직접 경로로 이동해 명령어 입력해야 한다.
기본적으로 cd Tab, 이용해 이동 가능
cd Tab : 파일 이동 명령어로 탭을 누르면 해당 폴더의 하위 폴더 및 파일명이 자동입력된다. 
상위로 이동하고 싶다면 cd ../ 입력

tsc 명령어 통해 컴파일. (typescript compile 약어)
node 파일명 입력하면 결과를 확인할 수 있다.

Type Script 문법 코드.

let num: number = 10;
let str: string = "10";

let bool = true;
//bool = 10;

let nameStr: string|number = "name";
nameStr = 10;

let ageVal: any = "";
ageVal = 10;
ageVal = true;
ageVal = function(){};

Ecma6의 문법을 사용하도록 한다. 변수 : let / 객체 : const
let num: number = 10; 
num 변수에 number 이외의 리터럴 값을 입력하면 컴파일 에러가 발생하게 된다.

다음과 같이 타입을 지정하지 않는 경우 처음 할당하는 리터럴 값에 따라 타입이 결정된다.
let bool = true; 
bool 은 boolean의 변수로 정해진것이다.


이후 "bool = 10;" 과 같이다른 타입의 변수를 할당할 수 없다.

다음과 같이 |를 이용해 여러 타입의 변수를 할당할 수도 있다.
let nameStr: string|number = "name"; 
nameStr = 10; 

any를 이용하면 자바스크립트의 var처럼 모든 타입의 리터럴 값을 할당 가능하다.
let ageVal: any = ""; 
ageVal = 10; 
ageVal = true; 
ageVal = function(){};

클래스 : ECMA Script 6(2015)에서 포함. Js 스펙이다.

export class Car{
    // private는 TypeScript부터 지원
    private tiresCount: number;
    private handleType: string;

    /**
     * 생성자
     */
    constructor(){

    }

    getTiresCount(): number{
        return this.tiresCount;
    }

    setTiresCount(tiresCount: number): void{
        this.tiresCount = tiresCount;
    }
    getHandleType(): string{
        return this.handleType;
    }

    setHandleType(handleType: string): void {
        this.handleType = handleType;
    }

}

 const car: Car = new Car();
    car.setHandleType("VOLVO");
    car.setTiresCount(4);

    console.log(car.getHandleType());
    console.log(car.getTiresCount());

Export가 public과 같은 역할. 다른 패키지에서 접근가능하도록 하는 접근지정자. 없다면 private으로 된다. 다음과 같이 클래스, 생성자, Getter, Setter를 작성할 수 있다.

function getAddResult(): number{
    return 10 + 50;
}

function getAddResultTwoNum(one: number, two: number):number{
    return one + two;
}

let result: number = getAddResult();
let result2: number = getAddResultTwoNum(30, 2);

console.log(result);
console.log(result2);

let func: () => number = function(): number{return 10;};

함수 또한 다음과 같이 타입을 지정할 수 있다.
마지막 줄에서 함수 변수의 리턴 타입을 지정할 때 => 를 사용하는 것이 특이사항.