아카이브

해당 패키지를 설치한 후에도 Could not find a declaration file for module '패키지 이름'. 해당 오류가 발생한다면, 다음과 같이 타입이 정의된 패키지로 설치해야 합니다.npm install @types/[패키지 이름] --save-dev

ParametersParameters는 대상 함수 타입에서의 매개변수 타입들을 불러옵니다.type typeParameter = Parameter returnType>만약 미리 선언된 함수를 사용한다면, 대신 typeof 연산자를 사용할 수 있습니다.function addToCart(id: string, quantity: number = 1): boolean { // ... return true;}type AddToCartParameters = Parameters;// type AddToCartParameters = [id: string, quantity: number | undefined]ReturnTypeReturnType은 대상 함수 타입에서 반환값의 타입을 불러옵니다.type typeReturn..

PickPick은 기존에 존재하던 타입에서 특정 요소만 선택해 구성되는 새로운 타입입니다.type typePick = Pick;생성된 타입은 다음과 같이 선택한 요소들만 지니게 됩니다.interface Product { id: string; name: string; price: number; membersOnly?: boolean;}type ProductInfo = Pick;const product: ProductInfo = { name: "shirt"; price: "120";}OmitOmit은 기존에 존재하던 타입에서 특정 요소만 제외해 구성되는 새로운 타입입니다.type typeOmit = Omit;생성된 타입은 다음과 같이 선택하지 않은 요소들만 지니게 됩니다.interface ..

TS 프로젝트를 빌드하면, 프로젝트 내의 .ts 파일들에 대해 각각 .js 파일들이 생성됩니다.파일의 수가 적다면 문제되지 않지만, 파일의 수가 많아지면 파일들을 한눈에 보기 어려워집니다. 빌드된 JS 파일들의 생성 위치를 미리 정해두면 간단하게 정리할 수 있는데,이 때 수정해야 하는 파일이 tsconfig.json입니다.outDiroutDir는 빌드된 파일이 생성되는 위치를 지정합니다.". / "는 현재 ts파일과 같은 위치를 나타냅니다. 때문에 기본값으로 ts파일과 같은 위치에 js파일이 생성됩니다.만약 outDir를 ". / dist" 로 설정하면, 모든 js파일들이 dist라는 폴더 안에 생성됩니다. ※ 사용할 때는 주석 처리를 해제해야 합니다!rootDirrootDir는 빌드될 파일 범위의 기준..

keyof는 딕셔너리 형태로 선언되어 있는 객체의 key값을 반환하는 키워드입니다.이를 이용하면 interface 타입과 같이 여러 타입으로 구성되어 있는 타입의 각 요소들을 쉽게 사용할 수 있습니다.interface Character { id: string; name: string; price: number; membersOnly?: boolean;}// 다음과 같은 코드를type characterProperty = 'id' | 'name' | 'hp' | 'mp';// keyof를 사용해서 간단하게 나타낼 수 있습니다.type characterProperty = keyof Character;typeof는 대상 변수의 타입을 반환하는 키워드입니다.JS의 typeof는 타입을 문자열로 반환하지만,..

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..

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..