타입스크립트(TypeScript)

Microsoft에서 개발한 오픈 소스 프로그래밍 언어입니다. JavaScript의 상위 확장(슈퍼셋)으로, 정적 타입 지정(static typing)을 지원하여 코드의 예측 가능성과 안정성을 높이는 도구입니다. 타입스크립트는 JavaScript의 모든 기능을 포함하며, 추가적으로 타입 주석을 통해 변수, 매개변수, 함수 등의 타입을 명시할 수 있습니다.

주요 특징과 장점

1. 정적 타입 지정

변수나 함수의 타입을 명시함으로써 코드의 오류를 사전에 발견할 수 있습니다. 이는 개발 시점에서 런타임 에러를 줄이고 안정성을 높이는 데 도움을 줍니다.

2. ECMAScript 표준 준수

최신 ECMAScript 표준을 따르며, JavaScript와의 호환성을 보장합니다.

3. 강력한 도구 지원

코드 완성, 리팩토링, 정적 분석 등의 다양한 도구 지원을 통해 개발 생산성을 높입니다.

4. 클래스, 모듈, 인터페이스

객체지향 프로그래밍을 지원하는 클래스와 인터페이스 등을 제공하여 구조화된 코드를 작성할 수 있습니다.

5. 널 안전성과 선택적 매개변수

null 및 undefined를 처리하기 위한 기능과 선택적 매개변수를 제공하여 코드의 유연성을 높입니다.

6. 오픈 소스와 커뮤니티 지원

오픈 소스로 개발되어 있어 커뮤니티 기여를 받고 있으며, 다양한 라이브러리와 프레임워크와의 호환성이 뛰어납니다.

타입스크립트의 사용 사례

대규모 프로젝트에서 코드의 복잡성을 관리하고 유지보수성을 높이기 위해 많이 사용됩니다.
Angular, React, Vue.js 등의 프론트엔드 프레임워크와 함께 사용되어 컴포넌트 기반의 UI 개발을 지원합니다.
서버 사이드 개발에서도 Node.js와 함께 사용되어 타입 안전성을 유지하고 개발 생산성을 높이는 데 도움을 줍니다.

---

기본 타입 (Basic Types)

1. Boolean: boolean

let isDone: boolean = false;
Number: number

2. Number: number

let decimal: number = 6;
let hex: number = 0xf00d;
let binary: number = 0b1010;
let octal: number = 0o744;

3. String: string

let color: string = "blue";
let fullName: string = `Bob Bobbington`;

4. Array: Array< elementType > 또는 elementType[]

let list1: number[] = [1, 2, 3];
let list2: Array<string> = ["a", "b", "c"];

5. Tuple: 고정된 요소 수와 각 요소의 타입을 정의한 배열

let x: [string, number];
x = ["hello", 10]; // OK

6. Enum: 열거형

enum Color {
  Red,
  Green,
  Blue,
}
let c: Color = Color.Green;

7. Any: 어떤 타입의 값이든 가능

let notSure: any = 4;
notSure = "maybe a string instead";

8.Void: 함수에서 반환값이 없음을 나타냄

function warnUser(): void {
  console.log("This is a warning message");
}

9. Null and Undefined: null과 undefined는 각각 null과 undefined 타입을 가집니다.

let u: undefined = undefined;
let n: null = null;

10. Never: 절대 발생하지 않을 값의 타입

function error(message: string): never {
  throw new Error(message);
}

11. Object: 비 원시 타입 (primitive types) 이외의 모든 것을 나타냄

let obj: object = {};

---

타입 정의 방법

1.인터페이스 (Interfaces): 객체의 구조를 정의

interface Person {
  name: string;
  age: number;
}
let person: Person = {
  name: "John",
  age: 30,
};

2.타입 별칭 (Type Aliases): 타입에 이름을 지정하여 재사용 가능한 새로운 타입 생성

type ID = string | number;
let userId: ID = 12345;

3.유니언 타입 (Union Types): 여러 타입 중 하나일 수 있는 값을 정의

type MyBool = true | false;
let isActive: MyBool = true;

4.교차 타입 (Intersection Types): 여러 타입을 하나로 결합

interface Animal {
  name: string;
}
interface Flyable {
  fly(): void;
}
type Bird = Animal & Flyable;

5.튜플 타입 (Tuple Types): 고정된 요소 수와 각 요소의 타입을 정의한 배열

let tuple: [string, number] = ["hello", 10];

6.타입 가드 (Type Guards): 런타임에서 타입을 검사하여 특정 타입으로 추정하게 함

function isNumber(x: any): x is number {
  return typeof x === "number";
}

---

고급 타입 (Advanced Types)

1.Conditional Types: 조건에 따라 타입을 선택

type TypeName<T> =
  T extends string ? "string" :
  T extends number ? "number" :
  T extends boolean ? "boolean" :
  "object";

2.Mapped Types: 기존 타입의 속성들을 새로운 타입으로 변환

type Readonly<T> = {
  readonly [P in keyof T]: T[P];
};

3.제네릭 (Generics): 타입이나 함수를 여러 타입으로 재사용할 수 있도록 일반화

interface Box<T> {
  value: T;
}
let box: Box<number> = { value: 10 };

4.문자열 리터럴 타입 (String Literal Types): 문자열 값을 타입으로 사용

type Easing = "ease-in" | "ease-out" | "ease-in-out";

5.엔빌트 타입 (Utility Types): 기본 제공되는 유틸리티 타입들로 타입을 조작할 수 있음

type Partial<T> = {
  [P in keyof T]?: T[P];
};

타입스크립트는 JavaScript 생태계의 발전과 함께 많은 개발자들 사이에서 선호되는 언어로 자리 잡고 있으며, 코드의 안정성과 예측 가능성을 높이는 데 기여하고 있습니다.

출처 : https://www.typescriptlang.org/docs/handbook/typescript-in-5-minutes.html