우아한 타입스크립트 2장

function double(n) {
  return n * 2
}

function double(n:number) {
  return n * 2
}

double(2),double("s")의 실행을 각각 보면
javascript는 4, NaN
typescript는 4, 에러 발생
으로 나타난다.

인자로 숫자가 아닌 다른 타입 값을 전달하면 의도치 않은 작업을 수행해서 원하는 값을 못 얻는다.

정적 타입과 동적 타입

자바스크립트에서 타입이 존재한다.
undefined, null, Boolean, String, Symbol, Numberic, Object
하지만 개발자가 컴파일 이전에 타입을 직접 정의해 줄 필요가 없었을 뿐이었던 것이다..
타입을 결정하는 시점에 따라 타입을 정적 타입과 동적 타입으로 분류할 수 있다.

정적타입: 모든 변수의 타입이 컴파일 타임에 결정된다. -> 조금 귀찮긴 하지만 프로그램의 안정성UP EX) C, 자바, 타입스크립트가 정적 타입 언어에 속함
동적타입: 변수 타입이 런타임에 결정된다 -> 코드의 자유성 보장 But오류에 대한 불안감 EX) 파이썬, 자바스크립트

컴파일타임: 소스코드를 이해할 수 있도록 기계어로 변환된느 시점
런타임: 변환된 파일이 메모리에 적재되어 실행하는 시점

강타입과 약타입

암묵적 타입 변환: 컴파일러 또는 엔진 등에 의해서 런타임에 타입이 자동으로 변경되는 것

** 암묵적 변환은 개발자가 명시적으로 타입을 변화하지 않아도 다른 데이터 타입끼리 연산을 진행할 수 있는 편리함 제공 **

강타입: 서로 다른 타입을 갖는 값끼리 연산을 시도하면 컴파일러 또는 인터프리터에서 에러가 발생 (파이썬, 루비, 타입스크립트)
약타입: 서로 다른 타입을 갖는 값끼리 연산할 때 컴파일러 또는 인터프리터가 내부적 판단하여 값의 타입을 변환하여 도출(C++,자바,자바스크립트)

약타입인 자바스크립트의 런타임에러를 방지하기 위해 타입을 명시하거나, 자동으로 타입을 추론하게 하는 타입스크립트가 나타났다.

컴파일 방식

고수준 언어 (자바,C#)은 컴파일을 하면 바이너리로 나타나지만 타입스크립트의 컴파일 결과물은 사람이 이해할 수 있는 방식인 자바스크립트 파일
타입스크립트는 자바스크립트에 타입이라는 레이어를 끼얹은 템플릿 언어 또는 확장 언어로 해석된다.

타입스크립트의 타입 시스템

1. 타입 애너테이션

변수나 상수 혹은 함수의 인자와 반환 값에 타입을 명시적으로 선언

1.  

let isDone : boolean = false
\\ 변수명 : 타입

물론 타입명을 지정하지 않아도 되지만 타입 추론하기 어렵다.

2. 구조적 타이핑

값이나 객체는 하나의 구체적인 타입을 가지고 있고 타입을 구분할 때 구조로 판단

2.  

일반적으로 서로 다른 클래스끼리 명확한 상속 관계나 공통 인터페이스가 없으면 호환 X
타입스크립트는 이름이 아닌 구조로 확인

3. 구조적 서브타이핑
   타입스크립트의 타입 시스템으로 집합으로 이해, 즉 타입은 값의 집합이고 특정 값은 많은 집합에 포함 가능
   EX)

   type stringNumber = string | number;

구조적 서브타이핑: 객체가 가지고 있는 속성을 바탕으로 타입을 구분
인터페이스나 클래스에도 같은 속성을 가지고 있으면 동작이 된다

class Person {

name: string;

age: number;

constructor(name:string, age:number) {

this.name =name

this.age = age

}

}

class Developer {

name: string;

age: number;

sleepTime: number;

constructor(name: string, age: number, sleepTime: number) {

this.name = name;

this.age = age;

this.sleepTime =sleepTime;

}

}

function greet(p:Person) {

console.log(`Hello, Im ${p.name}`)

}

const developer = new Developer("soo",20,7)

greet(developer)

developer 클래스가 함수 greet에 넣었을 때 실행이 된다

왜냐하면 developer는 person의 속성인 name을 가지고 있기 때문이다.

서로 다른 두 타입 간의 호환성은 오로지 타입 내부의 구조에 의해 결정된다. 
타입 A가 타입 B의 서브타입이라면  A타입의 인스턴스는 B타입이 필요한 곳에 어디든 들어가 계층구조로 자유롭다

 

4. 자바스크립트를 닮은 타입스크립트

하지만 C++, 자바와 같이 명목적 타이핑(nominal typing)은 타입의 구조가 아닌 타입의 이름만으로 구별한다.

즉 아까 전의 코드에서 실행을 했을 시 각 클래스에서 생성한 인스턴스는 서로 호환되지 않고 이름으로 타입을 구분하기 때문에 구조가 같더라도 이름이 다르면 다른 타입이다.

 

명목적 타이핑은 타입의 동일성을 확인하기에 안전성을 더 추구한다

하지만, 타입크립스트가 구조적 타이핑을 채택한 이유는 자바스크립트를 모델링한 언어이기 때문이다.

자바스크립트의 덕 타이핑(Duck Typing)을 기반으로 한다.

덕 타이핑은 어떤 함수의 매개변숫값이 올바르다면 그 값이 어떻게 만들어졌는지 신경 쓰지 않고 사용한다는 개념

 

 

5. 점진적 타이핑

타입스크립트는 모든 변수의 타입을 검사하지 않고 컴파일단계에서 타입이 없는 변수들은 any 타입으로 치환하여 읽는다.

즉 타입스크립트로 코드를 작성했다고 타입을 정확하게 지킨 것은 아니다.                 -+