아카이브

Interface는 여러 개의 타입 묶음을 하나의 타입으로 취급하는 방법입니다. 이는 비슷한 종류의 객체들이 중복되는 타입 묶음들을 공유할 때 하나의 타입으로 간단하게 표현할 수 있도록 합니다. 아래 코드는 id, name, price, membersOnly 네 가지 변수에 대한 타입 묶음을 Product라는 하나의 새로운 타입으로 나타내는 interface로 구현했습니다.interface Product { id: string; name: string; price: number; membersOnly?: boolean;}새롭게 정의한 Product를 이용하면 같은 객체 타입을 가지는 product1과 product2의 타입선언을 간단하게 표기할 수 있습니다.const product1: Produc..

열거형(enumerator)은 값의 종류를 나열할 수 있을 때 쓸 수 있는 타입입니다.대표적인 예로 옷의 사이즈를 기호로 나타낼 때 XS, S, M , L, XL과 같이 나타내는 경우가 있습니다.※ JS는 enum 타입을 지원하지 않습니다! enum 변수를 선언할 때는 중괄호 안에서 각 항목을 쉼표로 구분해서 적어주면 됩니다.enum Size { XS, S, M, L, XL,}이때 기본값은 0, 1, 2, ...이기 때문에, enum의 첫 번째 값(=0)은 조건문에서 거짓으로 처리될 수 있습니다.// 'this is false'를 출력합니다.if (Size.XS) { console.log('this is true');} else { console.log('this is fals..

함수를 선언할 때는 매개변수와 반환값의 타입을 명시해줍니다.마찬가지로 코드에서 충분히 추론이 가능하다면 반환값의 타입은 명시하지 않아도 됩니다.const stock: { [id: string]: number } = { c001: 3, c002: 1,};const cart: string[] = [];function getItem(item: string): string { return item;}매개변수의 디폴트값은 다음과 같이 나타냅니다.function addToCart(id: string, quantity: number = 1) { if (stock[id] 가변변수는 다음과 같이 나타냅니다.function addManyToCart(...ids: string[]) { for (const id of..

객체의 타입은 각 property의 타입을 정의함으로서 나타낼 수 있습니다.let product: { id: string; name: string; price: number; membersOnly?: boolean; sizes: string[];}위 객체에서 membersOnly와 같이 물음표(?)를 붙이면 optional property가 됩니다.Optional property는 인스턴스를 생성할 때 선언하지 않아도 되는 property입니다. 특정 property의 이름이나 개수를 지정하기 어려울 때는 다음과 같이 나타낼 수도 있습니다.let stock: { [id: string]: number;} = { c001: 3, c002: 0, c003: 1, // property의 개수와..

TS의 자료형은 JS의 자료형과 동일하게 쓰입니다.기본적으로 변수를 선언할 때 그 자료형을 추론할 수 있는 경우, 타입을 명시하지 않아도 됩니다.let size = 100; // 자료형은 number일 것입니다.그렇지 않은 경우, 변수 뒤에 콜론(:)과 함께 타입을 명시해주어야 합니다.let size: nubmer;배열이나 튜플도 동일한 방법으로 명시합니다.// arrayconst cart: string[] = [];const carts: string[][];// tuplelet mySize: [number, number]let mySize: [number, string]만약 다른 타입의 변수를 재할당하고자 한다면, 오류가 발생합니다.let size = 'L'size = '100' // 오류!let si..

TS는 JS 위에 만들어진 슈퍼셋(superset)언어입니다.때문에 기존의 node 환경에서 TS를 실행시키기 위해서는 JS코드로 컴파일 해주어야 하는데,이때 사용하는 것이 TSC(TypeScript Compiler)입니다.TSC는 크게 두 가지 일을 합니다.   1. TS 코드의 타입 검사  2. TS 코드에서 JS 코드로의 트랜스파일(transpile) 이 두 가지 과정을 거치면 JS 파일이 생성되고, node를 이용해 이 JS파일을 실행시킬 수 있습니다. ※ 트랜스파일 : 한언어로 작성된 소스 코드를 비슷한 수준의 추상화를 가진 다른 언어로 변환하는 것※ 컴파일 :  한 언어로 작성된 소스 코드를 다른 언어로 변환하는 것

VScode 기준으로 설명하겠습니다.node.js가 필요합니다.1. 패키지 초기화 & 생성프로젝트를 시작하고자하는 경로로 들어가 아래 명령어를 실행합니다.이를 통해 새로운 package.json 파일과 함께 빈 프로젝트를 새로 생성할 수 있습니다.npm initpackage.json이 올바르게 생성된 것을 확인했으면, TypeScript를 설치해 줍니다.먼저 TypeScript는 프로젝트 개발시에만 사용하기 때문에, 의존관계를 개발용으로(dev dependency) 설정해줍니다.npm install --save-dev typescript마지막으로 TypeScript의 설정 파일을 생성해줍니다.tsc : TypeScript에서 제공하는 컴파일 모듈로, TS 코드를 JS 코드로 변화시켜줄 것입니다.npx t..

TypeScript(TS)는 마이크로소프트에서 구현한 JavaScript의 슈퍼셋(Superset) 프로그래밍 언어입니다. 기존의 JavaScript는 동적 타이핑 형식으로 변수의 자료형에 제한을 두지 않습니다. 이 때문에 런타임 오류가 발생하기 쉬워, TypeScript는 JavaScript에 정적 타이핑을 추가했습니다. JavaScript의 문제점을 보완하여 만들어진 언어이기 때문에, 런타임에서 구동될 때 최종적으로 JavaScript 코드로 컴파일됩니다. ※ 동적 타이핑의 예시 : Python ※ 정적 타이핑의 예시 : C