[TypeScript] 개요

TypeScript

  - JavaScript에 Type을 부여한 언어

  - 목표 : JavaScript에 정적 타입을 추가하여, 더 안정적이고 유지보수가 용이한 코드를 작성하도록 돕는 것

  - 변수, 함수의 매개변수/반환값에 타입을 지정할 수 있음

     → 컴파일 시 타입 오류를 미리 확인할 수 있음

문자열로 정의되어 있는데 메서드처럼 호출할 때 컴파일 에러

 

  - .ts 확장자를 가진 파일로 작성됨

     → 컴파일 시 JavaScript로 변환되어 브라우저나 Node.js 환경에서 실행할 수 있음

 

 

---

변수 선언 및 초기화하기

# 타입 명시하기

  - Type Annotation (타입 주석)이라고 부름

let a: any // 모든 타입 가능
let b: number | undefined // number 타입 또는 undefined 타입 가능
let c: "open" | "closed" | "minimized" // 해당하는 문자열만 가능

let age: number = 25;  // number 타입
let name: string = "Alice";  // string 타입

# 타입을 명시하지 않아도 타입을 추론할 수 있음

let age = 25;  // number 타입
let name = "Alice";  // string 타입

 

함수의 매개변수와 반환값에 타입 지정하기

  - ? : Optional Parameter → 선택적으로 사용하고 싶은 파라미터의 오른쪽에 붙이기

// name은 string 타입, 필수값
// age는 number 타입, 선택값이며, 전달받지 않으면 undefined
function greet(name: string, age?: number): string {
    return `Hello, ${name}!`;
}

// age에 기본값 25 지정
function greet(name: string, age: number = 25): string {
    return `Hello, ${name}!`;
}

// 객체 타입
function printCoord(pt: { x: number; y: number }) {
    ...
}

// Promise 반환 함수인 경우
async function getFavoriteNumber(): Promise<number> {
  return 26;
}

 

익명 함수

  - 매개변수의 타입을 추론할 수 있는 경우라면 타입을 명시하지 않아도 됨

     → 'Contextual Typing' : 함수가 발생한 문맥에 따라 함수의 타입이 결정됨

const names = ["Alice", "Bob", "Eve"];
 
// string 타입이라고 추론이 가능하기 때문에 타입을 명시하지 않아도 됨
names.forEach(function (s) {
  console.log(s.toUpperCase());
});