λ³Έλ¬Έ λ°”λ‘œκ°€κΈ°

πŸ’¬/γ…γ……γ…Œγ…‹γ…γ…… μ±Œλ¦°μ§€

25일차

🀑

25일차

 

Part 4. TypeScript Essentials

Ch 3. Type System

Ch 4. TypeScript Compiler

 


 

Ch 3. Type System

 

 

 πŸ”— nolmplicitAny μ˜΅μ…˜μ„ 켜면

 

 νƒ€μž…을 λͺ…μ‹œμ μœΌλ‘œ μ§€μ •ν•˜μ§€ μ•Šμ€ 경우, νƒ€μž…μŠ€ν¬λ¦½νŠΈκ°€ μΆ”λ‘  쀑 any 라고 νŒλ‹¨ν•˜κ²Œ 되면, 컴파일 μ—λŸ¬λ₯Ό λ°œμƒμ‹œμΌœ λͺ…μ‹œμ μœΌλ‘œ μ§€μ •ν•˜λ„λ‘ μœ λ„ν•œλ‹€.

 

 

 πŸ”— strictNullChecks μ˜΅μ…˜μ„ 켜면 

 

 λͺ¨λ“  νƒ€μž…μ— μžλ™μœΌλ‘œ ν¬ν•¨λ˜μ–΄ μžˆλŠ” null κ³Ό undefined λ₯Ό μ œκ±°ν•΄μ€€λ‹€.

 

 

 πŸ”— noImplicitReturns μ˜΅μ…˜μ„ 켜면 

 

 ν•¨μˆ˜ λ‚΄μ—μ„œ λͺ¨λ“  μ½”λ“œκ°€ 값을 λ¦¬ν„΄ν•˜μ§€ μ•ŠμœΌλ©΄, 컴파일 μ—λŸ¬λ₯Ό λ°œμƒμ‹œν‚¨λ‹€.

 

 

 

 

 πŸ”— Structural Type System vs Nominal Type System 

  • Structural Type System: ꡬ쑰가 κ°™μœΌλ©΄, 같은 νƒ€μž…μ΄λ‹€.
  • Nominal Type System: ꡬ쑰가 같아도 이름이 λ‹€λ₯΄λ©΄, λ‹€λ₯Έ νƒ€μž…μ΄λ‹€.

 

 

 πŸ”— νƒ€μž… ν˜Έν™˜μ„± (Type Compatibility) 

  • μ„œλΈŒ νƒ€μž…
    1. κ°™κ±°λ‚˜ μ„œλΈŒ νƒ€μž…μΈ 경우, 할당이 κ°€λŠ₯ν•˜λ‹€. => 곡변
    2. ν•¨μˆ˜μ˜ λ§€κ°œλ³€μˆ˜ νƒ€μž…λ§Œ κ°™κ±°λ‚˜ μŠˆνΌνƒ€μž…μΈ 경우, 할당이 κ°€λŠ₯ν•˜λ‹€. => λ°˜λ³‘
      •  πŸ”— strictFunctionTypes μ˜΅μ…˜μ„ 켜면 
      • ν•¨μˆ˜λ₯Ό ν• λ‹Ήν•  μ‹œμ— ν•¨μˆ˜μ˜ λ§€κ°œλ³€μˆ˜ νƒ€μž…μ΄ κ°™κ±°λ‚˜ μŠˆνΌνƒ€μž…μΈ κ²½μš°κ°€ μ•„λ‹Œ 경우, μ—λŸ¬λ₯Ό 톡해 κ²½κ³ ν•œλ‹€.

 

 

 πŸ”— νƒ€μž… 별칭 (Type Alias) 

 

 μ§μ ‘ μž‘μ„±ν•΄μ•Όν•˜λŠ” νƒ€μž…μ„ λ‹€λ₯Έ μ΄λ¦„μœΌλ‘œ 지정할 수 μžˆλ‹€. => 반볡(타이핑)을 쀄여쀀닀.

 

 


 

 

Ch 4. TypeScript Compiler

 

 

 πŸ”— Compliation Context 

 

 TS λ₯Ό JS 둜 λ³€ν™˜ν•˜λŠ” TypeScript Compiler의 방식을 지정해 λ‘” 것을 Compliation Context 라고 ν•˜κ³ , tscofing.json νŒŒμΌμ— μ„ μ–Έλ˜μ–΄ μžˆλ‹€.

 

https://json.schemastore.org/tsconfig

 

 

 πŸ”— μ΅œμƒμœ„ ν”„λ‘œνΌν‹° 

 

  • compileOnSave
    • μ €μž₯ν•  λ•Œ 컴파일 
    • true/false (default false)
  • extends
    • 상속을 λ°›μ•„μ˜¬ λΆ€λͺ¨μ˜ 경둜 μ„€μ •
    • 파일(μƒλŒ€) 경둜λͺ… (string)
  • compileOptions ⭐
    • typeRoots, types
      • 라이브러리λ₯Ό ./node_modules/@types 둜 지정해쀀닀. (λ‚΄μž₯ type definition μ‹œμŠ€ν…œ)
      • typeRoots: 경둜λ₯Ό μ°Ύμ•„μ„œ μ‚¬μš©
      • types: λͺ¨λ“ˆ μ΄λ¦„μ—μ„œ μ°Ύμ•„μ„œ μ‚¬μš©
    • target, lib
      • target: JS 버전 μ„€μ • (λΉŒλ“œμ˜ 결과물을 μ–΄λ–€ λ²„μ „μœΌλ‘œ ν•  것이냐)
      • lib: declaration file μ„€μ • (κΈ°λ³Έ type definition 라이브러리λ₯Ό μ–΄λ–€ 것을 μ‚¬μš©ν•  것이냐)
    • outDir, outFile, rootDir
      • outFile: λͺ¨λ“ˆλ“€μ„ ν•©ν•΄μ„œ ν•˜λ‚˜μ˜ 파일둜 λ§Œλ“€μ–΄μ€€λ‹€.
      • outDir: 컴파일 된 λͺ¨λ“ˆλ“€μ„ λͺ¨μ•„λ‘”λ‹€.
      • rootDir: root 디렉토리 μ„€μ •
    • strict
      • μ—„κ²©ν•˜κ²Œ νƒ€μž…μ„ 확인
      • !!무쑰건 true 둜 ν•˜κΈ°!! 
        • --nolmplicitAny
        • --nolmplicitThis
        • --strictNullChecks ⭐
        • --strictFuntionTypes
        • --strictPropertyInitialization
        • --strictBindCallApply
        • --alwaysStrict
  • files
    • 제일 κ°•λ ₯ 
    • 컴파일 ν•  파일 μ„ μ •
  • include
    • λ§€μΉ­λ˜λŠ” 파일 포함
  • exclude
    • 파일 μ œμ™Έ
    • μ„€μ • μ•ˆ ν•˜λ©΄ 4가지(node_modules, bower_componetns, jspm_packages, <outDir>)λ₯Ό default둜 μ œμ™Έν•œλ‹€.
  • references
  • typeAcquisition
  • tsNode

 

// tsconfig.json

{
  "compileOnSave": true,
  "extends": "./base.json",
  "compilerOptions": {}
 }

 

"compilerOptions": {
    "outDir": "./dist",
    "rootDir": "./src",
}

rootDir μ„€μ •

 

"compilerOptions": {
    "outDir": "./dist",
    // "rootDir": "./src",
}

rootDir μ„€μ • X

 

'πŸ’¬ > γ…γ……γ…Œγ…‹γ…γ…… μ±Œλ¦°μ§€' μΉ΄ν…Œκ³ λ¦¬μ˜ λ‹€λ₯Έ κΈ€

27일차  (0) 2022.03.17
26일차  (0) 2022.03.16
24일차  (0) 2022.03.07
23일차  (0) 2022.02.26
22일차  (0) 2022.02.25