A Developing Developer

DAY 50. TypeScript 심화 1일차 본문

내일배움캠프 4기/TIL

DAY 50. TypeScript 심화 1일차

H-JJOO 2023. 1. 26. 19:55
  • 문제발생

TypeScript 심화 (환경설정, 열거형(Enums)

  • 시도

-

  • 해결방안

-

  • 알게 된 것

1. tsconfig.json 설정

"outDir": "build" : ts 파일을 js 로 변환할때 build 파일에 변환한다.

"rootDir": "src" : ts 파일 지정 위치

 

2. nodemon.json 설정 : 파일이 바뀔때마다 수동적으로 파일을 실행하지 않아도 되도록 해주는 설정!

"ignore": [] : [] 배열 형태 안에, run 을 하지않을 디렉토리를 입력하면 run 하지 않음.

"exec": "npx ts-node ./src/index.ts" :  *.ts 로 하니까 에러가 " Error: Cannot find module './*.ts' " 발생... 모르겠네?

 

3. package.json 설정

"start:dev": "npx nodemon -q" : nodemone.json 설정 값을 바탕으로 실행시킬 스크립트를 만든다. 파일이 실행 될 때마다 나오는 세제리를 --quite 또는 -q 라는 flag 로 감춰준다.

 

4. 열거형(Enums) : 상수값들을 집합하여 선언한다. (숫자형, 문자형)

 - 숫자형 : 숫자가 기본값이고 값을 따로 정의하지 않으면 0의 기본값

+ Reverse mapping 가능! 

console.log(Color[0]); // "Red"
console.log(Color[1]); // "Green"
console.log(Color[4]); // undefined

  - 문자형 : 각 enum 값을 문자열을 명시해줘야한다.

enum Color {
   Red = "Red",
   Green = "Green",
   Blue = "Blue"
}

const myColor = Color.Red;
console.log(myColor) // "Red"

const yourColor = Color.Blue;
console.log(yourColor) // "Blue"

5. Enum 팁! 

객체 구조 분해할당과 같이 enum 도 분해 할당이 가능! + 분해 된 상수의 이름도 바꿀 수 있다!

const { Red, Green, Blue: ImBlue } = Color;

console.log(Green); // "Green"
console.log(ImBlue); // "Blue"
console.log(Blue); // Cannot find name 'Blue'. -> 상수의 이름을 바꿨으니 에러가 납니다

 

[결론]

 

Java 배울때 Enum 을 써본 기억이 있는데, 잘 쓰기는 참 어려워 보인다.

 

TypeScript 심화 예상대로 어렵다~

'내일배움캠프 4기 > TIL' 카테고리의 다른 글

1.27 ~ 2.3 나태지옥  (0) 2023.02.06
DAY 51. TypeScript 심화 2일차  (0) 2023.01.26
DAY 49. TypeScript 5일  (0) 2023.01.20
DAY 48. TypeScript 4일차  (0) 2023.01.19
DAY 47. TypeScript 3일차  (1) 2023.01.18