[Learning Typescript] Ch.2 타입시스템

2.1 타입의 종류
‘타입’이란 값의 형태 ( = 값에 존재하는 속성과 메서드 그리고 typeof 연산자가 설명하는 것)

자바스크립트의 7가지 기본 원시 타입
• Null
• Undefined
• Boolean
• String
• Number
• Bigint
• Symbol
• 변수의 타입을 유추하는 타입스크립트

let bestSong = Math.random() > 0.5 ? 'Chain of Fools' : 'Respect';

2.1.1 타입 시스템
타입 시스템이란 프로그래밍 언어가 타입을 이해하는 방법에 대한 규칙의 집합을 말한다.
1. 코드를 읽고 존재하는 모든 타입과 값을 이해한다.
2. 각 값이 초기 선언에서 가질 수 있는 타입을 확인한다.
3. 각 값이 추후 코드에서 어떻게 사용될 수 있는지 모든 방법을 확인한다.
4. 값의 사용법이 타입과 일치하지 않으면 사용자에게 오류를 표시한다.

2.1.1 타입 시스템
타입 시스템이란 프로그래밍 언어가 타입을 이해하는 방법에 대한 규칙의 집합을 말한다.

let firstName = 'Whitney';
firstName.length(); // Error : Type ‘Number’ has no call signatures

1. 코드를 읽고 존재하는 모든 타입과 값을 이해한다.
= 코드를 읽고 firstName이라는 변수를 이해한다.
2. 각 값이 초기 선언에서 가질 수 있는 타입을 확인한다.
= 초깃값이 ‘Whitney’ 이므로 firstName 변수는 string 타입이라고 결론짓는다.
3. 각 값이 추후 코드에서 어떻게 사용될 수 있는지 모든 방법을 확인한다.
= firstName.length() 코드를 확인한다.
4. 값의 사용법이 타입과 일치하지 않으면 사용자에게 오류를 표시한다.
= string은 .length() 멤버를 함수처럼 호출할 수 없다는 오류를 표시한다.

2.1.2 오류 종류
타입스크립트 오류의 종류는 크게 구문 오류 / 타입 오류로 나뉜다.
구문 오류 - 타입스크립트가 자바스크립트로 변환되는 것을 차단한 경우
타입 오류 - 타입 검사기에 따라 일치하지 않는 것이 감지된 경우

2.1.2 오류 종류
타입스크립트 오류의 종류는 크게 구문 오류 / 타입 오류로 나뉜다.
구문 오류 - 타입스크립트가 자바스크립트로 변환되는 것을 차단한 경우
타입스크립트가 타입스크립트 파일에서 자바스크립트 파일로 올바르게 생성할 수 없을 때를
말한다.

let let wet;

2.1.2 오류 종류
타입스크립트 오류의 종류는 크게 구문 오류 / 타입 오류로 나뉜다.
타입 오류 - 타입 검사기에 따라 일치하지 않는 것이 감지된 경우
타입 오류는 타입 검사기가 타입에서 오류를 감지했을 때 발생하며, 타입 오류가 발생했다고
해서 타입스크립트 파일이 자바스크립트 파일로 변환되는 것을 차단하지는 않음.
다만 예기치 못한 충돌이나 작동이 발생할 수 있음을 표현함.

let firstName = 'Whitney';firstName.length(); // Error : Type ‘Number’ has no callsignatures

2.2 할당 가능성
타입스크립트는 변수의 초깃값을 읽고 변수가 허용되는 타입을 결정한다.
그리고 나중에 변수에 새로운 값이 할달되면 새로운 값이 변수의 타입과 동일한지를 체크한다.

let lastName = 'King';
lastName = true;
// Error : Type ‘boolean’ is not assignable to type ‘string’

2.3 타입 애너테이션
변수에 타입스크립트가 읽어야할 초기값이 없는 경우, 기본적으로 타입스크립트는 변수를 암묵적인 any 타입으로 간주한다.

let rocker; // Type: any
rocker = ‘Joan’; // Type: string
rocker = 19.58; // Type: number

• any 타입은 어떤 타입으로든 진화하는 것을 허용하기 때문에 타입 검사 목적을 쓸모없게 만든다.

• 때문에 타입스크립트는 초깃값을 할당하지 않아도 변수의 타입을 선언할 수 있는 구문인 타입 애너테이션을 제공한다.

2.3 타입 애너테이션

let rocker: string;
rocker = 19.58;

• 타입 애너테이션은 런타임 코드에 영향을 주지 않고, 유효한 자바스크립트 구문이 아님

• 타입 애너테이션은 타입스크립트 코드를 자바스크립트로 컴파일 했을때 코드가 삭제됨

• 변수에 타입 애너테이션으로 정의한 타입 외의 값을 할당하면 타입 오류가 발생함

2.3 불필요한 타입 애너테이션

let name: string = 'Tina';

• 이미 타입스크립트가 string 타입임을 유추할 수 있는 상황에서 타입 애너테이션은 불필요
  한 중복 코드임

let name: string = 4;

• 타입 애너테이션을 명시한 상황에서 다른 타입으로 초기화할 수 없음

2.4 타입 형태

let rapper = ‘Queen';
rapper.push(‘!');
// Error: Property ‘push’ does not exist on type ‘string’

• 타입스크립트는 객체의 형태에 대한 이해를 바탕으로 할당 가능성 뿐 아니라 객체 사용과
  관련된 문제도 알려준다.
  타입스크립트는 객체에 어떤 멤버 속성이 있는지 알고, 확인한다.

2.4.1 모듈
자바스크립트는 ECMA2015에서 파일간의 import, export구문을 표준화하는 ECMAScript Modules(ESM)을 추가하였다.

타입스크립트는
1. 최신 모듈 파일을 기존 파일과 함께 실행할 수 있고,
2. 모듈 파일에 선언된 모든 것은 export 문에서 내보내면 다른 파일에서 사용 할 수 있다.
3. 타입스크립트는 CommonJS의 모듈 명세를 통해 불러온 값은 인식하지 못해서 any 타입으로 인식한다.

• CommonJS? 자바스크립트의 모듈화를 위한 프로젝트 중 하나로 Node.js (서버사이드 자바스크
  립트)의 표준. module.exports로 내보내고 require로 가져온다.

• ESM과 비교했을 때? CommonJS는 동기, ESM은 비동기로 동작하여 ESM이 속도가 빠르고 실
  제 사용되는 부분만 import하여 (Tree Shaking) 메모리를 적게 차지하고 가독성이 좋음

2.4.1 모듈

import { shared } from ‘./a';
export const shared = 'Cher';

import한 shared 변수와 정의한 shared 변수의 이름이 충돌하면 타입 에러가 발생한다.

// a.ts
const shared = ‘Cher';// Error: Cannot redeclare bolck-scoped variable ‘shared’

파일에 export 혹은 import 문이 없으면 타입 에러가 발생한다.
export {}; 를 추가하여 강제로 모듈이 되게 만들면 타입 에러를 제거할 수 있다.

Reference:

https://www.learningtypescript.com/