[우아한 타입스크립트] 1장

📍 1.1 웹 개발의 역사

1995년 브랜든 아이크가 웹의 다양한 콘텐츠를 표현하지 위한 객체 지향 언어로 자바스크립트를 만들었다.

초기 자바스크립트는 단지 새로운 기능이 추가되는 형태로 발전했기 때문에 자바스크립트와 브라우저의 발전 속도 간의 차이가 나기 시작했고 브라우저는 자바스크립트의 변화를 따라가지 못했다. 

폴리필은 브라우저가 지원하지 않는 코드를 브라우저에서 사용할 수 있도록 변환한 코드 조각이나 플러그인
트랜스파일은 최신 버전의 코드를 예전 버전의 코드로 변환하는 과정

 

모든 브라우저에서 동일하게 동작하도록 자바스크립트가 표준화되자 정적 웹사이트에서 동적 웹 애플리케이션으로의 전환이 가속화되었다.

 

웹사이트

수집된 데이터, 정보를 특정 페이지에 표시하기 위한 정적인 웹

단방향으로 정보를 제공하기 때문에 사용자와 상호작용 X

 

웹 애플리케이션

사용자와 상호작용하는 쌍방향 소통의 웹

검색, 댓글, 좋아요 등 수많은 애플리케이션이 동작

 

 

👉🏻 컴포넌트 베이스 개발(CBD) 방법론

→ 재사용할 수 있는 컴포넌트를 개발 또는 조합해 하나의 애플리케이션을 만드는 개발 방법론

컴포넌트는 모듈과 유사하게 하나의 독립된 기능을 재사용하기 위한 코드 묶음

런타임 환경에서 독립적으로 배포, 실행될 수 있는 단위

컴포넌트는 다른 컴포넌트와의 의존성을 최소화하거나 없애야 한다

 

 

 

📍 1.2 자바스크립트의 한계

동적 타입 언어

자바스크립트는 동적 타입 언어로 변수에 타입을 명시적으로 지정하지 않고 런타임에 변숫값이 할당될 때 해당 값의 타입에 따라 변수 타입이 결정된다.

자바스크립트 엔진에서 주석, 함수 이름, 개발자 의도 같은 것은 고려 대상이 아니다.

 

 

한계를 극복하기 위한 방안

 

⦁ JSDoc

모듈, 네임스페이스, 클래스, 메서드 등에 대한 API 문서 생성 도구

주석에 @ts- check를 추가하면 타입 및 에러 확인이 가능하며 소스코드에 타입 힌트를 제공하는 HTML 문서를 생성할 수 있다.

주석의 성격을 지니고 있기 때문에 강제성을 부여해 사용하기 어렵다.

 

⦁ propTypes

리액트에서 컴포넌트 props의 타입을 검사하기 위해 사용하는 속성

전체 애플리케이션의 타입 검사를 하는 데는 사용할 수 없고 리액트에서만 사용할 수 있다.

 

⦁ 다트

구글이 자바스크립트를 대체하기 위해 제시한 새로운 언어로 타이핑이 가능하다.

 

 

✨ 타입스크립트의 등장!

마이크로소프트는 자바스크립트의 슈퍼셋 언어인 타입스크립트를 공개했다.

→ 슈퍼셋은 기존 언어에 새로운 기능과 문법을 추가해 보완하거나 향상하는 것

 

안정성 보장

정적 타이핑을 제공해 컴파일 단계에서 타입 검사를 해주기 때문에 타입 에러를 줄일 수 있고 런타임 에러를 사전에 방지할 수 있다.

 

개발 생산성 향상

VSCode 등의 IDE에서 타입 자동 완성 기능 제공한다.

변수와 함수 타입을 추론할 수 있고 어떤 prop을 넘겨야 하는지 매번 확인하지 않아도 사용부에서 바로 볼 수 있다.

 

협업에 유리

복잡한 개발, 협업에 유리하다.

타입스크립트는 인터페이스, 제네릭 등을 지원하는데 인터페이스가 기술되면 코드를 더 쉽게 이해할 수 있게 도와준다.

→ 타입스크립트 인터페이스는 객체 구조(속성과 메서드의 집합)를 정의하는 역할을 한다.

 

자바스크립트에 점진적으로 적용 가능

타입스크립트는 자바스크립트의 슈퍼셋이기에 일괄 전환이 아닌 점진적 도입이 가능하다.