πŸͺ΄ JavaScript & TypeScript

[TS] JS의 단점을 λ³΄μ™„ν•œ TypeScript

λ ¨λ”” 2024. 3. 4. 23:04
SMALL

 

* JavaScript

-  νŽ˜μ΄μ§€μ— 동적 효과λ₯Ό μ£ΌκΈ°μœ„ν•΄ λ§Œλ“€μ–΄μ§„ μ–Έμ–΄
-  Node.jsλ₯Ό 톡해 λ°±μ—”λ“œ λ˜ν•œ λ‹€λ£° 수 μžˆλ‹€

 

- 단점 :  λ„ˆλ¬΄ κ΄€λŒ€ν•œ μ–Έμ–΄
1)  λŸ°νƒ€μž„μ— νƒ€μž…μ΄ κ²°μ •λ˜λŠ” 동적 νƒ€μž… μ–Έμ–΄  -> 였λ₯˜ λ°œμƒ κ°€λŠ₯μ„± λ†’μŒ, 디버깅 어렀움 
2) μ•½ν•œ νƒ€μž… 체크 (λ³€μˆ˜/μƒμˆ˜ κ΅¬λΆ„ν•˜λŠ” let, const 만 지원)
3) 객체 μ„±μ§ˆ μˆ˜μ‹œλ‘œ λ³€ν™” κ°€λŠ₯

 

 

 

 

=>> κ·Έλž˜μ„œ λ“±μž₯ν•œ νƒ€μž…μŠ€ν¬λ¦½νŠΈ !

 

 

*  TypeScript

- microsoftμ—μ„œ κ°œλ°œν•œ μ˜€ν”ˆμ†ŒμŠ€ ν”„λ‘œκ·Έλž˜λ° μ–Έμ–΄
- JSλ₯Ό 기반으둜 λ§Œλ“€μ–΄μ Έ, JS 의 단점을 λ³΄μ™„ν•œ μ–Έμ–΄. 
- νƒ€μž…μ„ λͺ…μ‹œν•΄μ€Œ
- ν˜„μž¬λŠ” ν•„μˆ˜ μŠ€νƒμ΄ λ˜μ—ˆμŒ! (ν•œλ²ˆ TSλ₯Ό μ“΄ κ°œλ°œμžλŠ” JS둜 λͺ»λŒμ•„간닀ꡬ ν•œλ‹€ ..!γ…‡_γ…‡)

 

 

 JS의 단점 보완

μ•„λž˜μ™€ 같이 JS의 단점을 λ³΄μ™„ν•¨μœΌλ‘œμ¨, 생산성과 μ•ˆμ „μ„± μ¦λŒ€

 

1) JS : λŸ°νƒ€μž„μ— νƒ€μž… κ²°μ • (동적 μ–Έμ–΄) => TS : 컴파일 μ‹œκ°„μ— λ³€μˆ˜νƒ€μž… 체크 (정적 μ–Έμ–΄)
2) JS : μ•½ν•œ νƒ€μž… 체크, 객체 μ„±μ§ˆ 변화에 κ΄€λŒ€ =>  TS : νƒ€μž… 체크, 객체 속성 체크 λΆ„λͺ…νžˆν•΄μ€Œ ( VSCμ—μ„œ μ½”λ“œ μ“Έ λ•Œ λ°”λ‘œ μ—λŸ¬ λ©”μ„Έμ§€)

+ 좔가적 μž₯점
 1) TS의 객체 μ§€ν–₯ ν”„λ‘œκ·Έλž˜λ° 
    - 객체 속성 λ§ˆμŒλŒ€λ‘œ λ³€κ²½ν•˜μ§€ μ•Šλ„λ‘, 속성 직접 μ ‘κ·Όν•  수 없도둝 보μž₯ κ°€λŠ₯
 2)  μ™ΈλΆ€ λͺ¨λ“ˆμ˜ νƒ€μž… 정보 제곡 (d.ts μ„ μ–Έ 파일 톡해). μ„ μ–Έ 파일 μ„€μΉ˜λ₯Ό 톡해 JS λΌμ΄λΈŒλŸ¬λ¦¬λ„ TSμ—μ„œ μ‚¬μš© κ°€λŠ₯

SMALL