본문 바로가기
Notes/TypeScript

TypeScript Chapter. 1

by seyoonagain 2024. 12. 5.

TypeScript


TypeScript 설치

Node.js 설치

Node.js 공식 홈페이지를 통해 설치

Node.js를 설치하는 이유

  1. 타입스크립트의 컴파일러 tsc가 Node.js 환경에서 실행하기 때문
  2. 개발환경에서 TypeScript 설치 시, Node.js의 npm을 통해 설치하기 때문

TypeScript 설치

TypeScript 공식 홈페이지 참고

설치 방법

  1. 프로젝트마다 독립적으로 설치
npm install typescript --save-dev
  1. 개발 기기에 전역으로 설치
npm install -g typescript

컴파일러 환경설정

tsconfig.json 파일 만들기

tsc --init
{
  "compilerOptions": {
    "target": "es2016", // 변환될 자바스크립트 호환 버전
    "module": "es2015", // 생성될 모듈 시스템의 형식
    "esModuleInterop": true, // import, export 사용을 쉽게 도와주는
    "forceConsistentCasingInFileNames": true, // 파일명의 대소문자 구분 여부
    "strict": true, //
    "skipLibCheck": true,
    "outDir": "dist",
    "noUncheckedIndexedAccess": true
  },
  "include": ["src/**/*"]
}
  • target: 변환될 자바스크립트 버전 지정
  • module: 생성될 모듈 시스템의 형식
  • esModuleInterop: 자바스크립트의 두 가지 가져오기/내보내기 방식 간의 호환성을 높여주는 옵션
  • forceConsistenceCasingInFileNames: 파일명의 대소문자 구분 여부
  • strict: 타입스크립트 엄격 모드
    • noImplicitAny: any 타입 방지
    • strictNullChecks: nullundefined를 명시적으로 처리해야 함
    • strictFunctionTypes: 함수의 매개변수 및 반환값 검사 강화
  • skipLibCheck: node_modules 내부의 타입 정의 파일에 대해 검사하지 않도록 설정
  • outDir: 컴파일된 JavaScript 파일의 출력 디렉토리를 지정
  • noUncheckedIndexedAccess: 객체나 배열에 인덱스를 통해 접근할 때 항상 값의 유효성을 확인하도록 강제
  • include: TypeScript가 컴파일할 파일의 경로 지정

Type

string

const string_1: string = '작은따옴표 큰따옴표 둘 다 됨';
const string_2: string = `백틱`;

number

const number_1: number = 123;
const number_2: number = 9.99;
const number_3: number = -15;
const number_4: number = 3.4e-5;
const infinity: number = Infinity;
const minusInfinity: number = -Infinity;
const iAmNotANumber: number = NaN;

boolean

const boolean_1: boolean = true;
const boolean_2: boolean = false;

null

const user: string | null = null;

function login(userName: string) {
  user = userName;
}

function logout() {
  user = null;
}

login('seyoonee');
logout();

any

타입스크립트를 쓰는 것이 무의미하므로, 사용을 지양하도록 한다.

let someValue: any = 'any';
someValue = 123;
someValue = true;

'Notes > TypeScript' 카테고리의 다른 글

TypeScript Chapter. 5  (1) 2024.12.09
TypeScript Chapter. 4  (1) 2024.12.08
TypeScript Chapter. 3  (0) 2024.12.07
TypeScript Chapter. 2  (1) 2024.12.07