์ด ๋ฌธ์„œ์˜ ์›๋ณธ์€ ์™ธ๋ถ€ ์œ„ํ‚ค์—์„œ ๊ฐ€์ ธ์™”์Šต๋‹ˆ๋‹ค.
๊ณต์‹ ์‚ฌ์ดํŠธ


1. ๊ฐœ์š”2. ์ƒ์„ธ3. ๊ฐœ๋ฐœ ํ™˜๊ฒฝ ๋งŒ๋“ค๊ธฐ4. ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ์™€์˜ ์ฐจ์ด5. ์‚ฌ์šฉ ์‚ฌ๋ก€
5.1. ๋ฐฑ์—”๋“œ์™€ ํ”„๋ก ํŠธ์—”๋“œ ํ†ตํ•ฉ5.2. ํ”„๋ก ํŠธ์—”๋“œ
6. ํŠน์žฅ์ 
6.1. ๊ธฐ์กด ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ ์†Œ์Šค์™€์˜ ํ˜ธํ™˜6.2. ๋‹ค๋ฅธ ์–ธ์–ด์™€์˜ ๋ฌธ๋ฒ• ์œ ์‚ฌ์„ฑ6.3. IDE์™€์˜ ๊ถํ•ฉ6.4. npm ์‚ฌ์šฉ
7. ์ฃผ์˜์‚ฌํ•ญ
7.1. ๊ฒฐ๊ตญ์—๋Š” ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ๋กœ ์ปดํŒŒ์ผ7.2. ํ•™์Šต ๊ณก์„  ๋ฐ Trade-off7.3. npm ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ์˜ ๋น„ํ˜ธํ™˜
8. ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ9. ๊ด€๋ จ ๋ฌธ์„œ

1. ๊ฐœ์š”[ํŽธ์ง‘]

๋งˆ์ดํฌ๋กœ์†Œํ”„ํŠธ์—์„œ ๊ตฌํ˜„ํ•œ JavaScript์˜ ์Šˆํผ์…‹(Superset) ํ”„๋กœ๊ทธ๋ž˜๋ฐ ์–ธ์–ด. ํ™•์žฅ์ž๋กœ๋Š” .ts๋ฅผ ์‚ฌ์šฉํ•˜๋ฉฐ, ์ปดํŒŒ์ผ์˜ ๊ฒฐ๊ณผ๋ฌผ๋กœ JavaScript ํŒŒ์ผ์ธ .js๋ฅผ ์ถœ๋ ฅํ•œ๋‹ค. ์ตœ์ข…์ ์œผ๋กœ ๋Ÿฐํƒ€์ž„์—์„œ๋Š” ์ด๋ ‡๊ฒŒ ์ถœ๋ ฅ๋œ JavaScript ์ฝ”๋“œ๋ฅผ ๊ตฌ๋™์‹œํ‚ค๊ฒŒ ๋œ๋‹ค.

2. ์ƒ์„ธ[ํŽธ์ง‘]

TypeScript๋ผ๋Š” ์ด๋ฆ„๋‹ต๊ฒŒ ์ •์  ํƒ€์ž…์„ ๋ช…์‹œํ•  ์ˆ˜ ์žˆ๋‹ค๋Š” ๊ฒƒ์ด ์ˆœ์ˆ˜ํ•œ ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ์™€์˜ ๊ฐ€์žฅ ํฐ ์ฐจ์ด์ ์ด๋‹ค. ๋•๋ถ„์— ๊ฐœ๋ฐœ ๋„๊ตฌ(IDE๋‚˜ ์ปดํŒŒ์ผ๋Ÿฌ ๋“ฑ)์—๊ฒŒ ๊ฐœ๋ฐœ์ž๊ฐ€ ์˜๋„ํ•œ ๋ณ€์ˆ˜๋‚˜ ํ•จ์ˆ˜ ๋“ฑ์˜ ๋ชฉ์ ์„ ๋”์šฑ ๋ช…ํ™•ํ•˜๊ฒŒ ์ „๋‹ฌํ•  ์ˆ˜ ์žˆ๊ณ , ๊ทธ๋ ‡๊ฒŒ ์ „๋‹ฌ๋œ ์ •๋ณด๋ฅผ ๊ธฐ๋ฐ˜์œผ๋กœ ์ฝ”๋“œ ์ž๋™ ์™„์„ฑ์ด๋‚˜ ์ž˜๋ชป๋œ ๋ณ€์ˆ˜/ํ•จ์ˆ˜ ์‚ฌ์šฉ์— ๋Œ€ํ•œ ์—๋Ÿฌ ์•Œ๋ฆผ[1] ๊ฐ™์€ ํ’๋ถ€ํ•œ ํ”ผ๋“œ๋ฐฑ์„ ๋ฐ›์„ ์ˆ˜ ์žˆ๊ฒŒ ๋˜๋ฏ€๋กœ ์ˆœ์ˆ˜ ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ์— ๋น„ํ•ด ์–ด๋งˆ์–ด๋งˆํ•œ ์ƒ์‚ฐ์„ฑ ํ–ฅ์ƒ์„ ๊พ€ํ•  ์ˆ˜ ์žˆ๋‹ค. ์ฆ‰, '์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ๋ฅผ ์‹ค์ œ๋กœ ์‚ฌ์šฉํ•˜๊ธฐ ์ „์— ์žˆ์„๋งŒํ•œ ํƒ€์ž… ์—๋Ÿฌ๋“ค์„ ๋ฏธ๋ฆฌ ์žก๋Š” ๊ฒƒ' ์ด ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ์˜ ์‚ฌ์šฉ ๋ชฉ์ ์ด๋‹ค.

๊ฐœ๋ฐœ์ž์™€ ๋„๊ตฌ ๊ฐ„์˜ ์ƒํ˜ธ์ž‘์šฉ์—์„œ ๋ฟ๋งŒ ์•„๋‹ˆ๋ผ ๊ฐœ๋ฐœ์ž ๊ฐ„์˜ ์ƒํ˜ธ์ž‘์šฉ์—์„œ๋„ ์ƒ๋‹นํ•œ ์ด์ ์ด ์žˆ๋Š”๋ฐ, API๋ฅผ ๊ตฌํ˜„ํ•˜๊ณ  ์‚ฌ์šฉํ•จ์— ์žˆ์–ด ํ•ด๋‹น API์˜ ์ธํ’‹๊ณผ ์•„์›ƒํ’‹์ด ๋ฌด์—‡์ธ์ง€ ๋ช…ํ™•ํ•˜๊ฒŒ ํ‘œํ˜„ํ•  ์ˆ˜ ์žˆ์œผ๋ฏ€๋กœ, API ํ•˜๋‚˜ ์“ฐ๋Š”๋ฐ์—๋„ ์ผ์ผ์ด ๋งค๋‰ด์–ผ์„ ์ฐพ์•„๋ด์•ผ ํ•˜๊ฑฐ๋‚˜ ์‹ฌํ•˜๋ฉด ํ•ด๋‹น API์˜ ์ฝ”๋“œ๊นŒ์ง€ ๋’ค์ ๊ฑฐ๋ ค๋ด์•ผ ํ•˜๋Š” ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ์— ๋น„ํ•ด ํšจ์œจ์ ์ด๋‹ค.

3. ๊ฐœ๋ฐœ ํ™˜๊ฒฝ ๋งŒ๋“ค๊ธฐ[ํŽธ์ง‘]

ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ๋ฅผ ์‚ฌ์šฉํ•˜๋ ค๋ฉด npm์ด ํ•„์š”ํ•˜๋‹ค. Node.js๋ฅผ ์„ค์น˜ํ•˜๋ฉด npm์ด ์ž๋™์œผ๋กœ ์„ค์น˜๋œ๋‹ค. npm์„ ์„ค์น˜ํ•˜๊ณ  ๋‚˜๋ฉด ํ„ฐ๋ฏธ๋„์ด๋‚˜ ๋ช…๋ น ํ”„๋กฌํ”„ํŠธ์—์„œ
npm i -g typescript
๋ฅผ ์ž…๋ ฅํ•˜๋ฉด ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ ์ปดํŒŒ์ผ๋Ÿฌ(ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ โ†’ ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ ๋ณ€ํ™˜๊ธฐ)๊ฐ€ ์„ค์น˜๋œ๋‹ค.

๋งŒ์ผ Windows์˜ ํŒŒ์›Œ์…ธ์—์„œ ์˜ค๋ฅ˜๊ฐ€ ๋ฐœ์ƒํ–ˆ๋‹ค๋ฉด ๊ด€๋ฆฌ์ž ๊ถŒํ•œ์˜ ํŒŒ์›Œ์…ธ์—์„œ
Set-ExecutionPolicy RemoteSigned
๋ฅผ ํ†ตํ•ด ํŒŒ์›Œ์…ธ์— ๊ถŒํ•œ์„ ์ฃผ๊ณ  ์ž…๋ ฅํ•œ๋‹ค.

Mac/Linux์—์„œ Node.js์™€ npm์„ ์‚ฌ์šฉํ•  ๋•Œ, ์œ„์—์„œ ์–ธ๊ธ‰ํ•œ Windowsํ™˜๊ฒฝ์—์„œ์˜ ๊ถŒํ•œ๋ฌธ์ œ์™€ ์œ ์‚ฌํ•œ ๊ถŒํ•œ ๋ฌธ์ œ๊ฐ€ ๋ฐœ์ƒํ•  ์ˆ˜ ์žˆ๋‹ค. ๊ทธ๋Ÿฐ ๋ฌธ์ œ๋ฅผ ๋ฏธ์—ฐ์— ๋ฐฉ์ง€ํ•˜๊ธฐ ์œ„ํ•ด nvm์„ ๋จผ์ € ์„ค์น˜ํ•˜๊ณ  npm์„ ์‚ฌ์šฉํ•˜๊ธฐ๋ฅผ ๊ถŒ์žฅํ•œ๋‹ค. nvm์„ ์“ฐ์ง€ ์•Š๊ณ  Node.js์™€ npm์„ ์‚ฌ์šฉํ•˜๋Š”๊ฑด ๋ฌผ๋ก  ๊ฐ€๋Šฅํ•˜์ง€๋งŒ ํŠนํžˆ Mac์€ sudo๋ฅผ ์›ฌ๋งŒํ•˜๋ฉด ์‚ฌ์šฉํ•˜์ง€ ๋ง๋ผ๊ณ  ํ•˜๋Š” OS์ธ ๋งŒํผ, ์ •๋ง ์ •๋ง ์ •๋ง ๊ท€์ฐฎ์€ ๋ฌธ์ œ์— ๋งŽ์ด ์–ฝํž ์ˆ˜ ์žˆ์œผ๋‹ˆ, ์ •์‹ ๊ฑด๊ฐ•๊ณผ ๋ณด์•ˆ์„ ์œ„ํ•ด nvm์„ ๊ผญ! ์„ค์น˜ํ•˜๊ธฐ ๋ฐ”๋ž€๋‹ค. Windows์—์„œ๋„ nvm์‚ฌ์šฉ์€ ๊ฐ€๋Šฅํ•˜๋‚˜ nvm-windows ๋Š” ์œ„์˜ nvm๊ณผ ์™„์ „ํžˆ ๋ถ„๋ฆฌ๋œ ํ”„๋กœ์ ํŠธ์ž„์„ ๊ฐ์•ˆํ•˜๊ณ  ์‚ฌ์šฉํ•ด์•ผ ํ•œ๋‹ค.

๊ทธ ๋’ค๋กœ๋Š” .ts ํŒŒ์ผ์„ ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ ์ž‘์„ฑํ•˜๊ณ  ํ„ฐ๋ฏธ๋„์ด๋‚˜ ๋ช…๋ น ํ”„๋กฌํ”„ํŠธ์—์„œ ํ•ด๋‹น ํด๋”๋กœ ์ด๋™ํ•˜์—ฌ 'tsc ํŒŒ์ผ์ด๋ฆ„(ํ™•์žฅ์ž ์ œ์™ธ)'๋ฅผ ์ž…๋ ฅํ•ด์ฃผ๋ฉด ๋œ๋‹ค.

์˜ˆ) ํŒŒ์ผ ์ด๋ฆ„์ด script.ts ์ผ ๋•Œ,
tsc script
์œ„์™€ ๊ฐ™์ด ์ž…๋ ฅํ•˜๋ฉด script.js ํŒŒ์ผ์ด ๊ฐ™์€ ํด๋”์— ์ƒ์„ฑ๋œ๋‹ค.

๋˜๋Š” ์•„๋ž˜์™€ ๊ฐ™์€ ๋ฐฉ๋ฒ•๋„ ์žˆ๋‹ค :
tsc --init
๋ฅผ ์‹คํ–‰ํ•œ ํ›„, ์ƒ์„ฑ๋˜๋Š” tsconfig.json์„ ์ˆ˜์ •ํ•˜๊ณ  ์•„๋ž˜์™€ ๊ฐ™์€ ๋ช…๋ น์–ด๋ฅผ ์‚ฌ์šฉํ•ด๋„ ๋™์ผํ•œ ๊ฒฐ๊ณผ๊ฐ€ ๋‚˜์˜จ๋‹ค.
tsc


๋‹ค์–‘ํ•œ IDE๋“ค์ด ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ๋ฅผ ์ง€์›ํ•˜๊ณ  ์žˆ์ง€๋งŒ, ์—ญ์‹œ ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ์˜ ์ œ์ž‘์‚ฌ์ธ ๋งˆ์ดํฌ๋กœ์†Œํ”„ํŠธ์˜ ๋น„์ฃผ์–ผ ์ŠคํŠœ๋””์˜ค ์ฝ”๋“œ์™€์˜ ๊ฐ€์žฅ ์ •ํ•ฉ์„ฑ์ด ํ›Œ๋ฅญํ•˜๋‹ค๊ณ  ํ‰๊ฐ€๋ฐ›๊ณ  ์žˆ๋‹ค. ์œ„์˜ ์ปค๋งจ๋“œ๋ฅผ ๋‚ด๋ถ€ ํ„ฐ๋ฏธ๋„์— ์ž…๋ ฅํ•ด ์ปดํŒŒ์ผํ•  ์ˆ˜๋„ ์žˆ๊ณ , ํ”„๋กœ์ ํŠธ ๋‚ด์˜ .vscode ํด๋”์— launch.json๋ฐ task.json ์„ค์ • ํŒŒ์ผ์„ ์ƒ์„ฑํ•ด์„œ ๋ณธ์ธ์˜ ํ”„๋กœ์ ํŠธ์— ์ ํ•ฉํ•œ ์„ค์ •์„ ์ž…๋ ฅํ•ด์ฃผ๋ฉด ๋น„์ฃผ์–ผ ์ŠคํŠœ๋””์˜ค์ฒ˜๋Ÿผ F5, ํ˜น์€ Ctrl + F5 ๋‹จ์ถ•ํ‚ค๋กœ ์ปดํŒŒ์ผ๋ถ€ํ„ฐ ์‹คํ–‰๊นŒ์ง€ ์ผ์‚ฌ์ฒœ๋ฆฌ๋กœ ์ง„ํ–‰์‹œํ‚ฌ ์ˆ˜๋„ ์žˆ๋‹ค.

4. ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ์™€์˜ ์ฐจ์ด[ํŽธ์ง‘]

  • ํƒ€์ž… ์„ ์–ธ ๊ธฐ๋Šฅ์˜ ์กด์žฌ
ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ์—์„œ๋Š” ๋ฒ„๊ทธ๊ฐ€ ์ผ์–ด๋‚˜๊ธฐ ์‰ฌ์šด ์š”์†Œ์˜ ํƒ€์ž…์„ ์„ ์–ธํ•˜์—ฌ ๋ฒ„๊ทธ๊ฐ€ ์ผ์–ด๋‚˜๋Š” ๊ฒƒ์„ ๋ง‰์•„์ค€๋‹ค. ๊ฐ€๋ น ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ์—์„œ๋Š” ํƒ€์ž…์ด ๋‹ค๋ฅธ ๋‘ ๋ณ€์ˆ˜๋ฅผ ๊ณ„์‚ฐ์„ ์‹œ์ผœ์ฃผ๋ฉด
const a = 3;
const b = '5';
console.log(a*b)
์ด๊ฒŒ ๊ณ„์‚ฐ์ด ์ž‘๋™๋˜์–ด 15๋ฅผ ์ถœ๋ ฅํ•˜๋Š” ๊ธฐ๋Šฅ์ด ์žˆ๋‹ค. ๋งŒ์ผ ํ”„๋กœ๊ทธ๋ž˜๋จธ๊ฐ€ ์ด๊ฒŒ ๋‹ค๋ฅธ ์–ธ์–ด์ฒ˜๋Ÿผ ๊ณ„์‚ฐ์ด ์ž‘๋™ํ•˜์ง€ ์•Š์„ ๊ฒƒ์„ ์˜๋„ํ•˜๊ณ  ์ด๋ ‡๊ฒŒ ์ฝ”๋“œ๋ฅผ ์ง€์—ˆ๋‹ค๋ฉด ์˜๋„์น˜ ์•Š์€ ์ž‘์—…์ด ์ด๋ฃจ์–ด์ง€๋Š” ๋ฒ„๊ทธ๊ฐ€ ๋ฐœ์ƒํ•˜๋Š” ๊ฒƒ์ด๋‹ค.

ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ์—์„œ๋Š”
const a:number = 3;
const b:string = '5';
console.log(a*b)
์ด๋ ‡๊ฒŒ ์ˆซ์ž๋ฉด ์ˆซ์ž, ๋ฌธ์ž์—ด์ด๋ฉด ๋ฌธ์ž์—ด์ด๋ผ๊ณ  ํƒ€์ž…์„ ์„ ์–ธํ•ด์ฃผ์–ด์„œ ๊ณ„์‚ฐ์ด ์ž‘๋™๋˜์ง€ ๋ชปํ•˜๊ฒŒ ํ•˜๊ฑฐ๋‚˜, ์ปดํŒŒ์ผ ์ „์— ์˜ค๋ฅ˜ ๋ฉ”์‹œ์ง€๋ฅผ ๋„์šฐ๊ฒŒ ํ•œ๋‹ค.[์˜ค๋ฅ˜๋ฉ”์‹œ์ง€]
JavaScript(ES5) [5]
var alist = document.querySelectorAll('a');
for (var i = 0; i < alist.length; i++) {
  alist[i].style.color = '#333'
};

var example = document.querySelector('.exampleClass');
example.style.backgroundColor = "#ccc";

document.addEventListener('mousemove', function () {
  var x = event.clientX;
  document.querySelector('h1').style.fontSize = (x / 50) + 'px'
});
TypeScript
const alist = document.querySelectorAll('a');
for (let i: number = 0; i < alist.length; i++) {
  alist[i].style.color = '#333'
};

const example: HTMLElement = document.querySelector('.exampleClass');
example.style.backgroundColor = "#ccc";

document.addEventListener('mousemove', function (event: MouseEvent) {
  const x = event.clientX;
  (document.querySelector('h1') as HTMLElement).style.fontSize = String(x / 50) + 'px';
});

5. ์‚ฌ์šฉ ์‚ฌ๋ก€[ํŽธ์ง‘]

5.1. ๋ฐฑ์—”๋“œ์™€ ํ”„๋ก ํŠธ์—”๋“œ ํ†ตํ•ฉ[ํŽธ์ง‘]

ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ๋Š” Node.js ๋Ÿฐํƒ€์ž„ ๋ฟ๋งŒ ์•„๋‹ˆ๋ผ, ์›๋ž˜ ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ์˜ ๊ณ ํ–ฅ์ธ ํ”„๋ก ํŠธ์—”๋“œ ๊ฐœ๋ฐœ์—์„œ๋„ ์ƒ๋‹นํžˆ ์œ ์šฉํ•˜๋‹ค. ํŠนํžˆ ํ”„๋ก ํŠธ์—”๋“œ์™€ ๋ฐฑ์—”๋“œ[6]๋ฅผ ๋ชจ๋‘ TypeScript๋กœ ๊ตฌํ˜„ํ•œ๋‹ค๋ฉด ์ข…์ „๊ณผ๋Š” ๋น„๊ตํ•  ์ˆ˜ ์—†์„ ์ •๋„๋กœ ๋†’์€ ๊ฐœ๋ฐœ ์•ˆ์ •์„ฑ๊ณผ ํŽธ์˜์„ฑ์„ ํ™•๋ณดํ•  ์ˆ˜ ์žˆ๋‹ค. ํ”„๋ก ํŠธ์—”๋“œ-๋ฐฑ์—”๋“œ ์ƒํ˜ธ ๊ฐ„ ๋ฐ์ดํ„ฐ ํ†ต์‹ ์„ ์œ„ํ•ด์„œ๋Š” ์ผ๋ฐ˜์ ์œผ๋กœ JSON ํ˜•์‹์˜ REST API๋ฅผ ๊ตฌํ˜„ํ•˜๊ฒŒ ๋˜๋Š”๋ฐ, [7] ์ด๋ ‡๊ฒŒ ์‚ฌ์šฉ๋˜๋Š” ๋ฐ์ดํ„ฐ ํฌ๋งท์€ ๊ฐœ๋ฐœ ๊ณผ์ • ์ค‘์— ์ˆ˜์—†์ด ๋ณ€๊ฒฝ๋˜๊ณ  ๋˜ ๋ณ€๊ฒฝ๋˜๊ธฐ ๋งˆ๋ จ์ด๋‹ค. ์ด๋กœ ์ธํ•ด ํ”„๋ก ํŠธ์—”๋“œ์™€ ๋ฐฑ์—”๋“œ ๊ฐœ๋ฐœ์ž ์‚ฌ์ด์—์„œ๋Š” ์ˆ˜๋„ ์—†์ด ์ปค๋ฎค๋‹ˆ์ผ€์ด์…˜ ๋กœ์Šค๊ฐ€ ๋ฐœ์ƒํ•˜๊ณ [8] ์ด๋Š” ๊ณ ์Šค๋ž€ํžˆ ๊ฐœ๋ฐœ์ž์˜ ํ”ผ๋กœ๋„ ์ƒ์Šน ๋ฐ ๊ฐœ๋ฐœ ๊ธฐ๊ฐ„ ์ฆ๊ฐ€, ์œ ์ง€๋ณด์ˆ˜์„ฑ์˜ ์ €ํ•˜๋กœ ์ด์–ด์ง„๋‹ค. ๊ฒŒ๋‹ค๊ฐ€ ์ด๋Ÿฌํ•œ ๋ฌธ์ œ์ ์€ ์‹ค์ œ๋กœ ์ฝ”๋“œ๋ฅผ ๋™์ž‘์‹œํ‚ค์ง€ ์ „๊นŒ์ง€๋Š” ์•Œ์•„์ฑ„๊ธฐ ์–ด๋ ค์šด ๊ฒฝ์šฐ๋„ ๋งŽ๊ธฐ ๋•Œ๋ฌธ์— ์ตœ์•…์˜ ๊ฒฝ์šฐ ๊ฒ€์ฆ๋˜์ง€ ์•Š์€ ๋ฒ„๊ทธ๊ฐ€ ๋‚จ์€ ์ฑ„ ํ”„๋กœ์ ํŠธ๋ฅผ ํผ๋ธ”๋ฆฌ์‹œํ•˜๊ฒŒ ๋  ์ˆ˜๋„ ์žˆ๋‹ค. TypeScript๊ฐ€ ์ด๋Ÿฌํ•œ ์‚ฌํƒœ๋ฅผ ๋ฏธ์—ฐ์— ๋ฐฉ์ง€ํ•  ์ˆ˜ ์žˆ๋Š” ์ด์œ ๋Š”, ํ”„๋ก ํŠธ์—”๋“œ์™€ ๋ฐฑ์—”๋“œ๊ฐ„์˜ ๋ฐ์ดํ„ฐ ํฌ๋งท์„ ํƒ€์ž…์œผ๋กœ ์ •์˜ํ•˜์—ฌ, ์ด๋ฅผ ์–‘์ธก์—์„œ ๊ณตํ†ต์œผ๋กœ ์ฐธ์กฐํ•˜๋„๋ก ๊ตฌํ˜„ํ•˜๊ณ [9], ๋ฐ์ดํ„ฐ ํฌ๋งท์˜ ๋ณ€๊ฒฝ ์‚ฌํ•ญ์ด ๋ฐœ์ƒํ•  ๊ฒฝ์šฐ ์ด๋ ‡๊ฒŒ ๊ณต์šฉํ™”๋œ ํƒ€์ž…์˜ ์ •์˜๋ถ€๋ฅผ ์ˆ˜์ •ํ•จ์— ๋”ฐ๋ผ ํ”„๋ก ํŠธ์—”๋“œ์™€ ๋ฐฑ์—”๋“œ ์ฝ”๋“œ์— ์ปดํŒŒ์ผ ์—๋Ÿฌ๋ฅผ ๋ฐœ์ƒ์‹œํ‚ด์œผ๋กœ์จ ๋ฐ์ดํ„ฐ ํฌ๋งท์˜ ํ†ต์ผ์„ ๊ฐ•์ œํ•˜๊ธฐ ๋•Œ๋ฌธ์ด๋‹ค.[10]

๋ฌผ๋ก  ๋ฐฑ์—”๋“œ ๊ฐœ๋ฐœ์ž๋“ค์€, ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ ์‚ฌ์šฉ ์ด์ „์— ํ”„๋ก ํŠธ์—”๋“œ ๊ฐœ๋ฐœ์ž์—๊ฒŒ ์˜ฌ๋ฐ”๋ฅธ API๋ฅผ ์ œ๊ณตํ•˜๊ณ  ๋ณธ์ธ์˜ ์ •์‹ ๊ฑด๊ฐ•์„ ์ง€ํ‚ค๊ธฐ ์œ„ํ•ด์„œ๋Š” Swagger๋“ฑ์˜ API๋ฌธ์„œ์˜ ์ž‘์„ฑ์ด ์„ ํ–‰๋˜๋Š” ๊ฒŒ ๊ถŒ์žฅ๋˜๊ธด ํ•˜๊ฒ ์œผ๋‚˜, IDE์—์„œ ์ œ๊ณตํ•˜๋Š” ์ž๋™ ์™„์„ฑ์ด๋‚˜ API ์—๋Ÿฌ ์•Œ๋ฆผ ๋“ฑ์˜ ํ”ผ๋“œ๋ฐฑ ๋•๋ถ„์— ๋ฌธ์„œ ์ฐธ์กฐ์˜ ํ•„์š”์„ฑ์„ ์ค„์ผ ์ˆ˜ ์žˆ๋‹ค๋Š” ๊ฒƒ ์ž์ฒด๊ฐ€ ์ƒ๋‹นํ•œ ์žฅ์ ์ด๋‹ค.

5.2. ํ”„๋ก ํŠธ์—”๋“œ[ํŽธ์ง‘]

๋ฌผ๋ก  ํ”„๋ก ํŠธ์—”๋“œ์—์„œ๋„ ๋‹จ๋…์œผ๋กœ ์‚ฌ์šฉ์ด ๊ฐ€๋Šฅํ•˜๋‹ค. ๋ฐ”๋‹๋ผ ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ๋กœ ์ปดํŒŒ์ผ ๋˜๋Š” ๊ฒƒ์€ ๋‹น์—ฐํ•˜๊ฑฐ๋‹ˆ์™€, Google์˜ Angularํ”„๋ ˆ์ž„์›Œํฌ๋Š” 2.0๋ถ€ํ„ฐ ์•„์˜ˆ ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ๋งŒ ์‚ฌ์šฉ๊ฐ€๋Šฅํ•˜๋„๋ก ๋ฐ”๋€Œ์—ˆ๋‹ค๊ทธ ๋•Œ๋ฌธ์— ์‚ฌ์šฉ์ž๋“ค์ด ๋งŽ์ด ๋–จ์–ด์ ธ๋‚˜๊ฐ”์ง€๋งŒ. Facebook์˜ ๋ฆฌ์•กํŠธ๋Š” React.js์™€ React Native๋ฅผ ๊ฐ€๋ฆฌ์ง€ ์•Š๊ณ  ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ ์‚ฌ์šฉ์ด ๊ฐ€๋Šฅํ•˜๋‹ค. ํ˜„์žฌ๋Š” JavaScript์™€ TypeScript์ง„์˜๊ฐ„์˜ ๊ต๋ฅ˜๋„ ๊ต‰์žฅํžˆ ํ™œ๋ฐœํ•˜๊ณ , DefinitelyTyped ๋“ฑ์˜ ๊ธฐ์—ฌ๋กœ๋ถ€ํ„ฐ React์—์„œ TypeScript๋ฅผ ์‚ฌ์šฉํ•˜๋Š” ๊ฒƒ์€ ์ •์„ ์ค‘์˜ ํ•˜๋‚˜๋กœ ์ž๋ฆฌ์žก์•˜๋‹ค. React์˜ ๊ฒฝ์šฐ๋Š” ํŠนํžˆ๋‚˜ Functional Component, Hooks์™€ ํ•จ๊ป˜ ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ๋ฅผ ์‚ฌ์šฉํ•œ๋‹ค๋ฉด ์ด์ „์— ํด๋ž˜์Šค ์ปดํฌ๋„ŒํŠธ๋ฅผ ์‚ฌ์šฉํ• ๋•Œ๋ณด๋‹ค ํ›จ์”ฌ ์‰ฝ๊ฒŒ ๊ฐœ๋ฐœ์ด ๊ฐ€๋Šฅํ•˜๋‹ค.

6. ํŠน์žฅ์ [ํŽธ์ง‘]

6.1. ๊ธฐ์กด ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ ์†Œ์Šค์™€์˜ ํ˜ธํ™˜[ํŽธ์ง‘]

ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ๋ฅผ ์‚ฌ์šฉํ•  ๋•Œ, ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ๊ฐ€ ๋Ÿฐํƒ€์ž„์—์„œ ๊ทธ๋Œ€๋กœ ๋Œ์•„๊ฐ€๋Š” ๊ฒฝ์šฐ๋Š” ๋“œ๋ฌผ๋‹ค. ๊ฐœ์š”์— ์„œ์ˆ ํ•˜์˜€๋“ฏ ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ๋Š” ์ปดํŒŒ์ผ์„ ํ†ตํ•ด ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ๋กœ ๋ณ€ํ™˜๋˜๋Š” ๊ฒƒ์ด ์ผ๋‹จ ์ฒซ๋ฒˆ์งธ ๋ชฉ์ ์ธ๋ฐ, ๊ทธ๋ ‡๊ธฐ ๋•Œ๋ฌธ์— ๊ธฐ์กด์˜ ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ์™€ ํ•จ๊ป˜ ์‚ฌ์šฉํ•˜๋Š” ๊ฒƒ์ด ๊ฐ€๋Šฅํ•˜๋ฉฐ, ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ ๋Ÿฐํƒ€์ž„์€ ๊ทธ ์ปดํŒŒ์ผ๋œ ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ๋ฅผ ๊ธฐ์กด์˜ ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ ํŒŒ์ผ๊ณผ ์‹คํ–‰ ๊ฐ€๋Šฅํ•˜๊ฒŒ ๋˜๋Š” ๊ฒƒ์ด๋‹ค. ๊ธฐ์กด์˜ ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ ํ”„๋กœ๊ทธ๋ž˜๋จธ๋“ค์€ ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ๋ฅผ ๋„์ž…ํ•  ๋•Œ, ์ฒ˜์Œ ๊ณ ๋ คํ•ด๋ด์•ผ ํ•  ๊ฒƒ์ด '*.d.ts' ํŒŒ์ผ ์ž‘์„ฑ์ด๋‹ค. ํด๋ž˜์Šค, ํด๋ž˜์Šค, ๋˜๋Š” ์–ด๋–ค ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ ๊ฐ์ฒด์ด๋“ ์ง€ ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ๋กœ ์ •์˜ ๊ฐ€๋Šฅํ•œ๋ฐ, ๊ธฐ์กด์˜ ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ ์†Œ์Šค๋ฅผ ์ผ์ ˆ ๊ฑด๋“œ๋ฆฌ์ง€ ์•Š๊ณ  *.d.ts ํŒŒ์ผ ์ž‘์„ฑ๋งŒ์œผ๋กœ ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ ๋„์ž…์— ํฐ ๋„์›€์„ ์ค„ ์ˆ˜ ์žˆ๋‹ค. DefinitelyTyped ๋ ˆํฌ์ง€ํ† ๋ฆฌ์—์„œ ๋‹ค์šด๋ฐ›๋Š” @types/<ํŒจํ‚ค์ง€์ด๋ฆ„> ํŒจํ‚ค์ง€๊ฐ€ ๊ทธ๊ฒƒ์ด๋‹ค. ์ด ๋ ˆํฌ์ง€ํ† ๋ฆฌ๋Š” ๊ธฐ์กด ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ npm ํŒจํ‚ค์ง€๋“ค์ด ๊ธฐ์กด ์†Œ์Šค๋ฅผ ๊ฑด๋“œ๋ฆฌ์ง€ ์•Š๊ณ  ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ ์ง„์˜์— ์ž์—ฐ์Šค๋Ÿฝ๊ฒŒ ๋…น์•„๋“ค ์ˆ˜ ์žˆ๋„๋ก ๋„์›€์„ ์ฃผ์—ˆ๋‹ค. Javascript ์–ธ์–ด ์ฐจ์›์—์„œ ์ง€์›ํ•˜๋Š” API๋“ค์˜ ์ž…์ถœ๋ ฅ ํƒ€์ž…๋“ค๋„ ์นœ์ ˆํ•˜๊ฒŒ ์ •์˜๋ผ ์žˆ๊ธฐ ๋•Œ๋ฌธ์— ์ด๋ฅผ ๋” ์•ˆ์ •์ ์œผ๋กœ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ๊ฒŒ ๋˜๊ธฐ๋„ ํ•œ๋‹ค.

๋˜ํ•œ ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ๋Š” const, let ๊ฐ™์€ ec2015 ์ด์ƒ์˜ ๋ฒ„์ „์—์„œ ์‚ฌ์šฉ๋˜๋Š” ๊ตฌ๋ฌธ์„ ์ง€์›ํ•˜๋Š”๋ฐ, ์ด๊ฑธ ์ปดํŒŒ์ผ์„ ์‹œํ‚ค๊ฒŒ ๋˜๋ฉด ec3 ๋ฒ„์ „์œผ๋กœ ์ปดํŒŒ์ผ์„ ์‹œ์ผœ์ค˜์„œ IE ๊ตฌ๋ฒ„์ „์—์„œ๋„ ์ž‘๋™ํ•  ์ˆ˜ ์žˆ๊ฒŒ ํ•ด์ค€๋‹ค! ์ฆ‰, ์ƒ์œ„ ๋ฒ„์ „์˜ ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ ๊ตฌ๋ฌธ์„ ์‚ฌ์šฉํ•˜๊ณ ๋„ IE ๊ตฌ๋ฒ„์ „์„ ์ง€์›ํ•  ์ˆ˜ ์žˆ๋‹ค.

6.2. ๋‹ค๋ฅธ ์–ธ์–ด์™€์˜ ๋ฌธ๋ฒ• ์œ ์‚ฌ์„ฑ[ํŽธ์ง‘]

์• ์ดˆ์— ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ๊ฐ€ C, C++, ์ž๋ฐ”๋‚˜ C#๊ฐ™์€ ์–ธ์–ด๋“ค์ฒ˜๋Ÿผ (), {}, ; ๋“ฑ์„ ์‚ฌ์šฉํ•˜๋Š” C-family์–ธ์–ด์ด๊ธฐ ๋•Œ๋ฌธ์— ๋ฌธ๋ฒ•์ ์œผ๋กœ ์œ ์‚ฌํ•จ์„ ๋‚ด์„ธ์šฐ๋Š” ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ ์—ญ์‹œ C-family์ธ๋ฐ, ๊ทธ ์ •๋„๊ฐ€ ํŠนํžˆ ๋” ๊ฐ€๊นŒ์›Œ์ ธ์„œ, ์˜ˆ๋ฅผ ๋“ค๋ฉด Generic์— <> ๊ธฐํ˜ธ๋ฅผ ์“ด๋‹ค. ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ๊ฐ€ ์ž๋ฐ”, C#, C++์™€๋Š” ๋ณธ์งˆ์ ์œผ๋กœ ๋น„์Šทํ•˜์ง€๋„ ์•Š์ง€๋งŒ, ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ๋ฅผ ์ฒ˜์Œ ์ž…๋ฌธํ•˜๋Š” ๊ธฐ์กด ๊ฐœ๋ฐœ์ž๋“ค์€ '์–ด! ์ €๊ฑฐ ์ œ๋„ค๋ฆญ์ด๋„ค!' ๋ผ๊ณ  ๋น ๋ฅด๊ฒŒ ์ดํ•ดํ•  ์ˆ˜ ์žˆ์„ ๊ฒƒ์ด๋‹ค. ๊ฑฐ๊ธฐ์— interface, const ๊ฐ™์€ ์ง€์‹œ๋ฌธ ์—ญ์‹œ ๊ธฐ์กด ์–ธ์–ด ์‚ฌ์šฉ์ž๋“ค์ด ์ต์ˆ™ํ•˜๋‹ค๊ณ  ๋А๋‚„๋งŒํ•œ ์‚ฌ์šฉ๋ฐฉ๋ฒ•์„ ๊ฐ–๊ณ  ์žˆ๋‹ค.

6.3. IDE์™€์˜ ๊ถํ•ฉ[ํŽธ์ง‘]

ํƒ€์ž… ๊ฐœ๋…์˜ ๋„์ž…์„ ํ†ตํ•ด TypeScript ๊ฐœ๋ฐœ์„ ์ง€์›ํ•˜๋Š” IDE๋กœ๋ถ€ํ„ฐ ํ’๋ถ€ํ•œ ํ”ผ๋“œ๋ฐฑ์„ ๋ฐ›์„ ์ˆ˜ ์žˆ๋‹ค. ์ผ๋ฐ˜์ ์ธ ์—ฌ๋А ์ •์  ํƒ€์ž… ์–ธ์–ด๋“ค์ฒ˜๋Ÿผ ์ž๋™ ์™„์„ฑ์„ ์ง€์›ํ•˜๊ฑฐ๋‚˜, ํ•ด๋‹น ํƒ€์ž…์ด ์ง€์›ํ•˜์ง€ ์•Š๋Š” ์—ฐ์‚ฐ[11]์˜ ์‹œ๋„๋‚˜ ์ž˜๋ชป๋œ ์ธ์ž๋ฅผ ์‚ฌ์šฉํ•œ ํ•จ์ˆ˜ ํ˜ธ์ถœ ๋“ฑ์„ ์ฝ”๋”ฉ ์ค‘์— ์ฆ‰์„์—์„œ ๊ฒ€์ถœํ•  ์ˆ˜ ์žˆ๋Š” ๊ฒƒ์€ ๊ธฐ๋ณธ. ์‹ฌ๋ณผ์˜ ์ด๋ฆ„์„ ๋ณ€๊ฒฝํ•˜๋ฉด ํ•ด๋‹น ์‹ฌ๋ณผ์„ ์ฐธ์กฐํ•˜๋Š” ๋ชจ๋“  ์ฝ”๋“œ๋“ค์„ ์ž๋™์œผ๋กœ ์ˆ˜์ •ํ•ด์ฃผ๋Š” ๋ฆฌํŒฉํ† ๋ง ๊ธฐ๋Šฅ ์—ญ์‹œ JavaScript๊ฐ€ ์•„๋‹Œ TypeScript์ด๊ธฐ ๋•Œ๋ฌธ์— ์ง€์›๋  ์ˆ˜ ์žˆ๋Š” ๊ธฐ๋Šฅ์ด๋‹ค. ๋Œ€ํ‘œ์ ์ธ IDE๋กœ๋Š” JetBrains์˜ WebStorm์ด ์žˆ์œผ๋ฉฐ IntelliJ IDEA๋„ ์–ผํ‹ฐ๋ฐ‹ ์—๋””์…˜์„ ๊ตฌ์ž…ํ•˜๋ฉด ์›น ๊ฐœ๋ฐœ ๊ธฐ๋Šฅ์„ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ๋‹ค.

ํŠนํžˆ Microsoft์—์„œ ๋งŒ๋“  ์–ธ์–ด๋‹ต๊ฒŒ, ๊ฐ™์€ ํšŒ์‚ฌ์—์„œ ๋งŒ๋“  Visual Studio Code(์ดํ•˜ VSC)์™€์˜ ๊ถํ•ฉ์ด ์—„์ฒญ๋‚˜๋‹ค. IDE๋Š” ์•„๋‹ˆ์ง€๋งŒ, ๊ฐ์ข… ํ”Œ๋Ÿฌ๊ทธ์ธ์„ ํ†ตํ•ด TypeScript๋กœ ์ƒ์ƒํ•  ์ˆ˜ ์žˆ๋Š” ๋ชจ๋“  ๊ฐœ๋ฐœํ™˜๊ฒฝ์„ ๋„ˆ๋ฌด๋‚˜ ์‰ฝ๊ฒŒ ๊ตฌ์ถ• ๊ฐ€๋Šฅํ•˜๋‹ค. VSC๋‚˜ ๊ทธ ํ”Œ๋Ÿฌ๊ทธ์ธ ์—ญ์‹œ ๋Œ€๋ถ€๋ถ„ TypeScript๋กœ ๊ฐœ๋ฐœ๋˜๊ณ  ์žˆ๊ธฐ ๋•Œ๋ฌธ์— ๋‹น์—ฐํ•˜๋‹ค๋ฉด ๋‹น์—ฐํ•œ ๊ฒฐ๊ณผ.

6.4. npm ์‚ฌ์šฉ[ํŽธ์ง‘]

๋ฟŒ๋ฆฌ๊ฐ€ ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ์ธ๋งŒํผ Node.js์˜ npm ํŒจํ‚ค์ง€๋“ค์„ ์†์‰ฝ๊ฒŒ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ์œผ๋ฉฐ, ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ ์ปดํŒŒ์ผ๋Ÿฌ ์ž์ฒด๊ฐ€ npm ํŒจํ‚ค์ง€์ด๊ธฐ๋„ ํ•˜๋‹ค. npm install typescript๋กœ ์„ค์น˜ ๊ฐ€๋Šฅํ•˜๋‹ค.

7. ์ฃผ์˜์‚ฌํ•ญ[ํŽธ์ง‘]

7.1. ๊ฒฐ๊ตญ์—๋Š” ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ๋กœ ์ปดํŒŒ์ผ[ํŽธ์ง‘]

ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ๋Š” ๊ฒฐ๊ตญ ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ๋กœ ์ปดํŒŒ์ผ๋˜์–ด ๋™์ž‘ํ•˜๊ณ , ์ด๋Š” ์—ญ์‹œ '๋Ÿฐํƒ€์ž„์—๋Š” ์•ฝํƒ€์ž…' ์ด๋ผ๋Š” ์•ฝ์ ์ด ์žˆ๋‹ค. ์˜ˆ๋ฅผ ๋“ค๋ฉด, ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ๋กœ ์ž‘์„ฑํ•œ Node.js ์„œ๋ฒ„๊ฐ€ ์ž˜ ๋™์ž‘์ค‘์ด๊ณ , Request๋ฅผ ๋ฐ›์•˜๋‹ค๋ฉด ์ด ๊ฐ์ฒด์˜ type์€ ๊ทธ๋ƒฅ "object"๋ผ๋Š” ๊ฒƒ์ด๋‹ค. ์ด๋Š” ๊ฒฝ์šฐ์— ๋”ฐ๋ผ ์ƒ๊ฐ๋ณด๋‹ค ํฐ ๋ฌธ์ œ๋Š” ์•„๋‹ ์ˆ˜ ์žˆ์œผ๋‚˜, ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ ์‚ฌ์šฉ์‹œ ์–ธ์ œ๋‚˜ ๋ฐ˜๋“œ์‹œ ๊ณ ๋ คํ•ด์•ผ ํ•  ๋ฌธ์ œ์ด๋‹ค. ๋ฌผ๋ก  TypeGuard ๊ธฐ๋Šฅ์ด๋‚˜, io-ts, fp-ts ๋“ฑ์˜ ํ•จ์ˆ˜ํ˜• ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ๋ฅผ ํ†ตํ•ด ํ•จ์ˆ˜ํ˜•์œผ๋กœ ๋Ÿฐํƒ€์ž„ ํƒ€์ดํ•‘๊นŒ์ง€ ์žก์„ ์ˆ˜ ์žˆ์ง€๋งŒ, ์•„์˜ˆ ๋Ÿฐํƒ€์ž„์—์„œ ์–ธ์–ด ์ฐจ์›์˜ ํƒ€์ž… ์ฒดํฌ๊ฐ€ ์ด๋ค„์ง€๋Š” ๊ฒƒ ๋ณด๋‹ค๋Š” ํ•ญ์ƒ ์ฐœ์ฐœํ•˜๋‹ค.

7.2. ํ•™์Šต ๊ณก์„  ๋ฐ Trade-off[ํŽธ์ง‘]

์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ๋Š” ๊ฐ์ฒด๊ฐ€ ๊ฐ–๋Š” ์†์„ฑ์„ ์–ด๋–ป๊ฒŒ๋“  ๊ฐœ๋ฐœ์ž๊ฐ€ ํŒŒ์•…ํ•ด์„œ ์–ด๋–ป๊ฒŒ๋“  ์—๋Ÿฌ ์—†์ด ๋™์ž‘ํ•˜๋„๋ก ์„ค๊ณ„ํ•˜๋Š” ๊ฒƒ์ด ๊ธฐ๋ณธ์ ์ธ ๊ฐœ๋ฐœ ํ๋ฆ„์ด๋‹ค. ๋ฐ˜๋ฉด ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ๋Š” ์ดํ† ๋ก ์ง€๋‚˜์น˜๊ฒŒ ์ž์œ ๋กœ์šด(=์œ„ํ—˜ํ•œ) ๋ณ€์ˆ˜/๊ฐ์ฒด ํ™œ์šฉ์— ์˜๋„์ ์œผ๋กœ ์ œ์•ฝ์„ ๊ฑธ์–ด ๊ฐœ๋ฐœ์˜ ์•ˆ์ •์„ฑ ๋ฐ ํŽธ์˜์„ฑ์„ ์ฆ๋Œ€์‹œํ‚ค๋Š” ๊ฒƒ์ด ๊ทธ ์กด์žฌ์˜์˜์ž„์— ์œ ์˜ํ•  ํ•„์š”๊ฐ€ ์žˆ๋‹ค.

ํŠนํžˆ ๋ณต์žกํ•œ ๊ฐ์ฒด๋ฅผ ์•ˆ์ „ํ•˜๊ฒŒ ํ™œ์šฉํ•  ์ˆ˜ ์žˆ๋„๋ก ์ œ๊ณต๋˜๋Š” ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ์˜ ๋Œ€ํ‘œ์ ์ธ ๋„๊ตฌ๊ฐ€ Advanced Type๊ณผ Utility Type์ธ๋ฐ, ์ด ๊ธฐ๋Šฅ๋“ค์€ ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ ๋ฟ๋งŒ์ด ์•„๋‹ˆ๋ผ ๋‹ค๋ฅธ ์–ธ์–ด์—์„œ๋„ ์ƒ์†Œํ•œ ๊ฐœ๋…[12]์ด๊ธฐ ๋•Œ๋ฌธ์— ๊ฐœ๋ฐœ์ž๋“ค์—๊ฒŒ ์ต์ˆ™ํ•˜์ง€ ์•Š์„ ๊ฐ€๋Šฅ์„ฑ์ด ์ƒ๋‹นํžˆ ๋†’๋‹ค. ๋ชจ๋“  ๊ฐœ๋ฐœ์ž๊ฐ€ ๋ฌธ์„œ๋ฅผ ํ•œ๋ฒˆ ๋ณด๊ณ  ์‘์šฉ ๊ฐ€๋Šฅํ•  ์ •๋„๊ฐ€ ์•„๋‹ˆ๊ธฐ ๋•Œ๋ฌธ์—, ์ฒซ ๋„์ž…์‹œ์— ์ด ๋ถ€๋ถ„์„ ๊ฐ„๊ณผํ•˜๋ฉด ์˜คํžˆ๋ ค ๋„์ž… ์ „๋ณด๋‹ค ์ƒ์‚ฐ์„ฑ์ด ์•ˆ์ข‹์•„์งˆ ์ˆ˜๋„ ์žˆ๋‹ค๋Š” ์ ์— ์œ ์˜ํ•˜๋Š” ๊ฒƒ์ด ์ข‹๋‹ค.

๋˜ํ•œ ์œ„์™€ ๊ฐ™์€ ๋„๊ตฌ๋ฅผ ํ™œ์šฉํ•ด์„œ ๊ธฐ๊ป ์—„๋ฐ€ํ•˜๊ฒŒ typing์„ ํ•ด๋†จ๋”๋‹ˆ ์—…๊ณ„์—์„œ ํ”ํžˆ ์žˆ๋Š”์š”๊ตฌ ์‚ฌํ•ญ ๋ฐ ๊ธฐ๋Šฅ ๋ณ€๊ฒฝ, ๋ฆฌํŒฉํ† ๋ง ์ž‘์—… ๋“ฑ์œผ๋กœ ์ธํ•ด ๊ธฐ๋Šฅ ๊ตฌํ˜„์— ๋”ํ•ด typing๊นŒ์ง€ ๋ค์œผ๋กœ ๋‹ค์‹œ ํ•ด์•ผ ํ•˜๋Š” ๋ถˆ์ƒ์‚ฌ๊ฐ€ ์ƒ๊ธธ ์ˆ˜๋„ ์žˆ๋‹ค. ๊ฒฝ์šฐ์— ๋”ฐ๋ผ์„œ๋Š” ์•„์˜ˆ any ํƒ€์ž…[13]๋กœ ๋„๋ฐฐํ•˜๋Š” ๊ฒƒ๋งŒ๋„ ๋ชปํ•œ ๊ฒฐ๊ณผ๊ฐ€ ์ดˆ๋ž˜๋  ์ˆ˜๋„ ์žˆ๋‹ค๋Š” ๊ฒƒ. ๋”ฐ๋ผ์„œ ์ ์žฌ์ ์†Œ์— ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ์˜ ๊ธฐ๋Šฅ์„ ๋„์ž…ํ•˜๋Š” ์•ˆ๋ชฉ์ด ํ•„์š”ํ•ด์งˆ ์ˆ˜ ์žˆ๋‹ค.

7.3. npm ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ์˜ ๋น„ํ˜ธํ™˜[ํŽธ์ง‘]

npm ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ๋ฅผ Typescript์—์„œ ์‚ฌ์šฉํ•˜๊ธฐ ์œ„ํ•ด์„œ๋Š” ํ•ด๋‹น ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ๊ฐ€ Typescript๋กœ ์ž‘์„ฑ๋˜์—ˆ๊ฑฐ๋‚˜, d.ts๋ฅผ ํ†ตํ•ด ๋งŒ๋“ค์–ด์ง„ Typescript์šฉ ํƒ€์ž…์ง€์ • ํŒจํ‚ค์ง€๊ฐ€ ๋ณ„๋„๋กœ ์žˆ๋Š” ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ๋งŒ ์ •์ƒ์ ์œผ๋กœ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ๋‹ค. ์œ ๋ช…ํ•œ ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ๋“ค์€ ๋Œ€๋ถ€๋ถ„ Typescript ํƒ€์ž…์ง€์ • ํŒจํ‚ค์ง€๋ฅผ ์ง€์›ํ•˜์ง€๋งŒ, ์ผ๋ถ€ ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ์˜ ๊ฒฝ์šฐ ์ด๋Ÿฐ ๊ฒƒ๋“ค์„ ์ง€์›ํ•˜์ง€ ์•Š๋Š” ๊ฒฝ์šฐ๊ฐ€ ์žˆ๋‹ค.

์ด๋Ÿฐ ๊ฒฝ์šฐ //@ts-ignore ์ฃผ์„์„ import๋ฌธ ์œ„์— ๋ถ™์ด๊ฑฐ๋‚˜ JS์™€ ๋™์ผํ•˜๊ฒŒ require()๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ ์ปดํŒŒ์ผ ์˜ค๋ฅ˜ ์—†์ด ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ๋ฅผ ์‚ฌ์šฉํ•  ์ˆ˜๋Š” ์žˆ๋‹ค. ๋ฌผ๋ก  ์ด๋ ‡๊ฒŒ ๋ถˆ๋Ÿฌ์˜จ ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ์˜ ์‹ฌ๋ณผ๋“ค์— ๋Œ€ํ•ด์„œ๋Š” ํƒ€์ž… ํ‰๊ฐ€๊ฐ€ ์ด๋ฃจ์–ด์ง€์ง€ ์•Š๊ธฐ ๋•Œ๋ฌธ์— Typescript์˜ ์žฅ์ ์„ ํ™œ์šฉํ•˜๊ธฐ ์–ด๋ ต๋‹ค.

8. ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ[ํŽธ์ง‘]

  • Angular - ๊ตฌ๊ธ€์—์„œ ๋งŒ๋“  ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ ํ”„๋ ˆ์ž„์›Œํฌ์ด๋‹ค. ๊ตฌ๋ฒ„์ „์€ ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ๋ฅผ ๋Œ€์ƒ์œผ๋กœ ํ–ˆ์œผ๋‚˜ ํ˜„๋ฒ„์ „์—์„œ๋Š” ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ๋ฅผ ๋Œ€์ƒ์œผ๋กœ ํ•˜๊ณ  ์žˆ๋‹ค.
  • React - ํŽ˜์ด์Šค๋ถ์—์„œ ๋งŒ๋“  ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ ํ”„๋ ˆ์ž„์›Œํฌ์ง€๋งŒ --template typescript ์˜ต์…˜์„ ์‚ฌ์šฉํ•˜๋ฉด ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ๋กœ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ๋‹ค.
  • Vue - ๋ฒ ์ด์Šค๋Š” ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ์ด์ง€๋งŒ ์ตœ๊ทผ์— ๋ฆด๋ฆฌ์ฆˆ๋œ 3.0๋ฒ„์ „ ์ดํ›„๋ถ€ํ„ฐ ts๋ฅผ ๊ณต์‹์ ์œผ๋กœ ์ง€์›ํ•œ๋‹ค. 2.x ๋ฒ„์ „์—์„œ๋„ ์‚ฌ์šฉ์ด ๋ถˆ๊ฐ€๋Šฅํ•œ ๊ฒƒ์€ ์•„๋‹ˆ์—ˆ์œผ๋‚˜, ๊ฐ์ข… ํ”Œ๋Ÿฌ๊ทธ์ธ๋“ค์„ ์‚ฌ์šฉํ•ด์•ผ ํ–ˆ๋‹ค. ๊ณต์‹์ ์œผ๋กœ ์ง€์›ํ•จ์— ๋”ฐ๋ผ ts ์‚ฌ์šฉ์— ํƒ„๋ ฅ์ด ๋ถ™์„ ๊ฐ€๋Šฅ์„ฑ์ด ๋†’์•„์กŒ๋‹ค.

9. ๊ด€๋ จ ๋ฌธ์„œ[ํŽธ์ง‘]

[1] ๊ฐ€๋ น ์ˆซ์ž๊ฐ€ ๋“ค์–ด์™€์•ผ ํ•  ๊ณณ์— ๋ฌธ์ž๊ฐ€ ๋“ค์–ด์˜จ๋‹ค๋ฉด ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ๋Š” ๊ทธ ์ฝ”๋“œ๋ฅผ ์•„๋ฌด ์˜์‹ฌ์—†์ด ์‹คํ–‰ํ•ด์„œ ๋Ÿฐํƒ€์ž„์—์„œ ์•Œ ์ˆ˜ ์—†๋Š” ๋™์ž‘์„ ํ•œ๋‹ค. ์–ด๋–ป๊ฒŒ๋“  ๋™์ž‘ ์ž์ฒด๋Š” ํ•˜๊ธฐ ๋•Œ๋ฌธ์— ์ด๋Ÿฌํ•œ ๋ฒ„๊ทธ๋ฅผ ๋””๋ฒ„๊น…ํ•˜๋Š” ๊ฑด ๋งค์šฐ ๊ท€์ฐฎ์€ ์ผ์ธ๋ฐ, ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ๋Š” ์ด๋Ÿฐ ์ฝ”๋“œ์— ๋Œ€ํ•ด์„œ๋Š” ์ปดํŒŒ์ผํƒ€์ž„์— ์—๋Ÿฌ๋ฅผ ๋ฐœ์ƒ์‹œ์ผœ ๊ฐœ๋ฐœ์ž์—๊ฒŒ ์•Œ๋ ค์ฃผ๋ฏ€๋กœ ๊ฐœ๋ฐœ์ž๊ฐ€ ์ž์‹ ์˜ ์‹ค์ˆ˜๋ฅผ ์‰ฝ๊ฒŒ ํŒŒ์•…ํ•  ์ˆ˜ ์žˆ๋‹ค. ๋ณดํ†ต์˜ ๊ฒฝ์šฐ, ๋ช…์‹œ์ ์œผ๋กœ ๋ช…๋ น์„ ๋„ฃ์–ด ์ปดํŒŒ์ผํ•˜๊ธฐ๋„ ์ „์— ์ž˜๋ชป๋œ ๋ถ€๋ถ„์— ์‹œ๋ป˜๊ฑด ๋ฐ‘์ค„์„ ์ซ™์ซ™ ์ณ์„œ ์• ์ดˆ์— ์ปดํŒŒ์ผ ์ž์ฒด๊ฐ€ ๋ถˆ๊ฐ€๋Šฅํ•˜๊ฒŒ ๋งŒ๋“ ๋‹ค.
[์˜ค๋ฅ˜๋ฉ”์‹œ์ง€] "The right-hand side of an arithmetic operation must be of type 'any', 'number', 'bigint' or an enum type.; ์ˆ˜๋ฆฌ ์—ฐ์‚ฐ์˜ ์šฐํ•ญ ํƒ€์ž…์€ 'any', 'number', 'bigint' ํ˜น์€ ์—ด๊ฑฐํ˜•์ด์–ด์•ผ ํ•ฉ๋‹ˆ๋‹ค."
[3] ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ์™€ ์ตœ์‹  ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ๋ฅผ ์ด์ œ ๋ง‰ ์‹œ์ž‘ํ•˜๋Š” ์ดˆ๋ณด ๊ฐœ๋ฐœ์ž๋“ค์„ ์œ„ํ•ด ์กฐ์–ธํ•˜์ž๋ฉด, ์•„๋ž˜ ์†Œ์Šค์ฝ”๋“œ์— ์žˆ๋Š”๊ฒƒ๊ณผ ๊ฐ™์€ var ์ง€์‹œ์–ด์™€ let ์ง€์‹œ์–ด๋Š” ์ฒซ ํ•™์Šต์—๋งŒ ์ตํžˆ๊ณ  var๋Š” ์•„์˜ˆ ์‚ฌ์šฉํ•˜์ง€ ๋ง๊ณ  let์€ ๋ฐ˜๋ณต๋ฌธ ๊ฐ™์ด ๊ผญ ํ•„์š”ํ•œ ๊ณณ์„ ์ œ์™ธํ•˜๊ณ  ์‚ฌ์šฉํ•˜์ง€ ์•Š๋Š” ํŽธ์ด ์ข‹๋‹ค. ์–ธ์ œ, ์–ด๋–ป๊ฒŒ ๋ณ€์ˆ˜๊ฐ€ ๋ณ€ํ•˜๋Š”์ง€, ๊ทธ๋ฆฌ๊ณ  ์–ธ์ œ ๊ทธ ๋ณ€์ˆ˜๋ฅผ ๋‹ค์‹œ๋Š” ์‚ฌ์šฉํ•˜์ง€ ์•Š๊ฒŒ ๋˜๋Š”์ง€, ์–ธ์ œ ์–ด๋–ป๊ฒŒ ๋ณ€์ˆ˜๊ฐ€ ํ•„์š”์—†์–ด์ง€๋Š”์ง€ ๋ช…ํ™•ํ•˜๊ฒŒ ์ œ์‹œํ•˜๊ธฐ ์œ„ํ•ด์„œ๋Š” const, ์ƒ์ˆ˜ ์ง€์‹œ์–ด๋งŒ ์‚ฌ์šฉํ•˜๋Š” ํŽธ์ด ํ›จ์”ฌ ์ข‹๊ธฐ ๋•Œ๋ฌธ์ด๋‹ค. const๋Š” '{}์œผ๋กœ ๋‘˜๋Ÿฌ์‹ธ์ธ ๊ณณ ์•ˆ์—์„œ ๋ณ€ํ•˜์ง€ ์•Š๋Š” ์ƒ์ˆ˜'์˜ ๊ฐœ๋…์ด๋‹ค. ๋˜ํ•œ const๋กœ ์ƒ์ˆ˜๋ฅผ ์„ ์–ธํ–ˆ์„ ๋•Œ์—๋Š” ๊ตณ์ด ํƒ€์ž…์„ ์„ ์–ธํ•  ํ•„์š”๊ฐ€ ์—†๋Š” ๊ฒฝ์šฐ๊ฐ€ ๋งŽ์€๋ฐ ๋‹ค๋ฅธ ๊ฐ’์„ ๋Œ€์ž…ํ•  ์ผ์ด ์—†๊ธฐ ๋•Œ๋ฌธ์ด๋‹ค. ์•„๋ž˜ ์˜ˆ์‹œ์ฒ˜๋Ÿผ const์— ํƒ€์ž…์„ ๊ตณ์ด ์„ ์–ธํ•˜๋Š” ๊ฒฝ์šฐ๋Š” ์ปดํŒŒ์ผ๋Ÿฌ๊ฐ€ ํƒ€์ž…์ถ”๋ก ์— ์‹คํŒจํ•ด์„œ ํ•˜๋Š” ๊ฒฝ์šฐ ๋“ฑ์ด๋‹ค.
[4] ๋˜ํ•œ ์•„๋ž˜ ์˜ˆ์‹œ์—์„œ์ฒ˜๋Ÿผ as๋กœ Casting์„ ํ•ด์ฃผ๋Š” ๊ฒฝ์šฐ๋„ ์ข‹์€ ์‚ฌ๋ก€์ด์ง€๋งŒ, ์• ์ดˆ์— ์ €๋Ÿฐ Casting์—†์ด ์ปดํŒŒ์ผ๋Ÿฌ์˜ ํƒ€์ž…์ถ”๋ก ๋งŒ์œผ๋กœ ํ•จ์ˆ˜๋‚˜ ๋ณ€์ˆ˜, ํด๋ž˜์Šค๋ฅผ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ๊ฒŒ๋” ํƒ€์ž…์„ ์ •์˜ํ•˜๋Š” ๊ฒƒ์ด ๋” ์ค‘์š”ํ•˜๋‹ค. ๊ทธ๋Ÿฐ ํƒ€์ž…์ •์˜์— ์‹œ๊ฐ„์ด ์˜ค๋ž˜ ๊ฑธ๋ฆฌ๋Š”๊ฒƒ ๊ฐ™์•„๋„ ๊ฒฐ๊ตญ์—๋Š” ์‹œ๊ฐ„์„ ๋ช‡์‹ญ๋ฐฐ ์ ˆ์•ฝํ•  ์ˆ˜ ์žˆ๋‹ค.
[5] tsc์—์„œ ์˜ต์…˜์„ ์ •ํ•ด์ฃผ์ง€ ์•Š์œผ๋ฉด TypeScript๋Š” JavaScript ES5๋กœ ๋ณ€ํ™˜๋˜๊ธฐ ๋•Œ๋ฌธ์— const๋‚˜ let์ด var๋กœ ๋ฐ”๋€๋‹ค.
[6] Express ํ”„๋ ˆ์ž„์›Œํฌ ๋“ฑ.
[7] XML์„ ์“ฐ๋Š” ๊ฒฝ์šฐ๋„ ์žˆ์ง€๋งŒ, ๋กœ์ง ๊ฐœ๋ฐœ์„ JavaScript ํ˜น์€ ๊ทธ ํŒŒ์ƒ ์–ธ์–ด๋กœ ์ง„ํ–‰ํ•˜๋ฉด์„œ ๊ตณ์ด XML์„ ์‚ฌ์šฉํ•ด์•ผ ํ•  ์ด์œ ๋Š” ๊ฑฐ์˜ ์—†๋‹ค. ์›๋ž˜๋ถ€ํ„ฐ JSON ํ˜•์‹์„ ๊ฐ–์ถ˜ JavaScript ๊ฐ์ฒด๋ฅผ ๊ตณ์ด XML๋กœ ์ง๋ ฌํ™”ํ•˜๊ฑฐ๋‚˜ ๋ฐ˜๋Œ€๋กœ XML์„ JavaScript ๊ฐ์ฒด ํ˜•์‹์œผ๋กœ ํŒŒ์‹ฑํ•ด์•ผ๋งŒ ํ•˜๋Š” ๋ฒˆ๊ฑฐ๋กœ์›€์„ ๊ฒช์–ด์•ผ ํ•˜๊ธฐ ๋•Œ๋ฌธ.
[8] ์‹ฌ์ง€์–ด ํ”„๋ก ํŠธ์—”๋“œ์™€ ๋ฐฑ์—”๋“œ๋ฅผ ๊ฐ™์€ ์‚ฌ๋žŒ์ด ๊ฐœ๋ฐœํ•ด๋„ ํ•œ์ชฝ์— ๋ณ€๊ฒฝ ์‚ฌํ•ญ์ด ์žˆ๋‹ค๋Š” ๊ฑธ ๊นŒ๋จน๊ณ (...) ๋ฐ˜๋Œ€์ชฝ์— ์ด๋ฅผ ๋ฐ˜์˜ํ•˜์ง€ ์•Š๋Š” ์ผ€์ด์Šค๊ฐ€ ๊ฒฐ์ฝ” ๋“œ๋ฌผ์ง€ ์•Š๋‹ค.
[9] ํ”„๋กœ์ ํŠธ ์†Œ์Šค ์ฝ”๋“œ ๋‚ด๋ถ€์— ๋ณ„๋„ ํด๋”๋ฅผ ๋งŒ๋“ค์–ด ๋ฐ์ดํ„ฐ ํฌ๋งท์šฉ ํƒ€์ž…์„ ์ •์˜ํ•œ ์ฝ”๋“œ๋ฅผ ๋ชจ์•„๋‘˜ ์ˆ˜๋„ ์žˆ๊ณ , npm ํŒจํ‚ค์ง€ ๋“ฑ์˜ ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ๋กœ ๊ตฌํ˜„ํ•  ์ˆ˜๋„ ์žˆ๋‹ค.
[10] ๊ฐ€๋ น User๋ผ๋Š” ํƒ€์ž…์˜ id๋ผ๋Š” ํ•„๋“œ๋ฅผ name์œผ๋กœ ์ˆ˜์ •ํ•œ๋‹ค๊ณ  ํ•  ๋•Œ, ๊ธฐ์กด์˜ user.id๋ฅผ ์ฐธ์กฐํ•˜๊ณ  ์žˆ๋˜ ํ”„๋ก ํŠธ์—”๋“œ์™€ ๋ฐฑ์—”๋“œ์˜ ์ฝ”๋“œ๋“ค์€ ์ปดํŒŒ์ผ ์—๋Ÿฌ๋ฅผ ๋ฐœ์ƒ์‹œํ‚ค๊ณ  ๊ฐœ๋ฐœ์ž๋Š” ๋ฐ์ดํ„ฐ ํฌ๋งท์˜ ๋ณ€๊ฒฝ์— ๋”ฐ๋ผ ์–ด๋–ค ์ฝ”๋“œ๋“ค์ด ์ˆ˜์ •๋˜์–ด์•ผ ํ•˜๋Š”์ง€๋ฅผ ์‰ฝ๊ฒŒ ํŒŒ์•…ํ•  ์ˆ˜ ์žˆ๋‹ค. IDE์˜ ๋ฆฌํŒฉํ† ๋ง ๊ธฐ๋Šฅ์„ ํ™œ์šฉํ•˜๋ฉด ์—ฐ๊ด€๋œ ๋ชจ๋“  ์ฝ”๋“œ๋“ค์„ ์ž๋™ ์ˆ˜์ •ํ•ด์ฃผ๊ธฐ๊นŒ์ง€ ํ•˜๋ฏ€๋กœ ์ผ์ผํžˆ ๊ณ ์น  ํ•„์š”์กฐ์ฐจ ์—†๋Š” ๊ฒฝ์ง€์— ์ด๋ฅธ๋‹ค.
[11] ๊ฐ€๋ น number ํƒ€์ž…์œผ๋กœ ์„ ์–ธ๋œ ๋ฐฐ์—ด์— string์„ ์‚ฝ์ž…ํ•˜๋Š” ๋“ฑ.
[12] ๊ตณ์ด ์–ต์ง€๋กœ ๋น„๊ตํ•˜์ž๋ฉด Java๋‚˜ C# ๋“ฑ ์–ธ์–ด์˜ reflection ๊ฐœ๋…๊ณผ ๊ฒน์น˜๋Š” ๋ถ€๋ถ„์ด ์žˆ๊ธด ํ•˜๊ฒ ์ง€๋งŒ, ์• ์ดˆ์— reflection ์ž์ฒด๋„ ์ž์œ ์ž์žฌ๋กœ ํ™œ์šฉํ•  ์ˆ˜ ์žˆ๋Š” ๊ฐœ๋ฐœ์ž๊ฐ€ ํ”์น˜ ์•Š๋‹ค.
[13] ๋ง ๊ทธ๋Œ€๋กœ ์ด ๋ณ€์ˆ˜๋‚˜ ์ƒ์ˆ˜๋ฅผ ์–ด๋–ค ํƒ€์ž…์œผ๋กœ์จ ํ™œ์šฉํ•˜๋“  ์‹ ๊ฒฝ์“ฐ์ง€ ์•Š๊ฒ ๋‹ค๋Š” ์˜๋ฏธ์˜ ํƒ€์ž…์œผ๋กœ์จ, ์ด ํƒ€์ž…์œผ๋กœ ๋ณ€์ˆ˜๋ฅผ ์„ ์–ธํ•˜๋ฉด ์ปดํŒŒ์ผ๋Ÿฌ๊ฐ€ ๋ณ€์ˆ˜์˜ ์†์„ฑ์„ ํŒŒ์•…ํ•  ์ˆ˜ ์—†์œผ๋ฏ€๋กœ ์–ด๋–ป๊ฒŒ๋“  ๊ฐœ๋ฐœ์ž๊ฐ€ ํŒŒ์•…ํ•ด์„œ ์–ด๋–ป๊ฒŒ๋“  ์—๋Ÿฌ ์—†์ด ๋™์ž‘ํ•˜๋„๋ก ๋งŒ๋“ค์–ด์•ผ ํ•œ๋‹ค. ์ฆ‰ ์ด๊ฑธ ๋‚จ์šฉํ•˜๋ฉด ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ์™€ ๋‹ค๋ฅผ ๊ฒŒ ์—†์–ด์ง„๋‹ค.ํ‘๋งˆ๋ฒ•