{"id":1703,"date":"2026-06-03T16:41:44","date_gmt":"2026-06-03T16:41:44","guid":{"rendered":"https:\/\/wayhope.kro.kr\/?p=1703"},"modified":"2026-08-31T07:32:46","modified_gmt":"2026-08-31T07:32:46","slug":"typescript-%ec%96%b8%ec%96%b4-%ed%95%b5%ec%8b%ac-%ec%a0%95%eb%a6%ac","status":"publish","type":"post","link":"https:\/\/wayhope.kro.kr\/?p=1703","title":{"rendered":"TypeScript \uc5b8\uc5b4 \ud575\uc2ec \uc815\ub9ac"},"content":{"rendered":"\n

TypeScript\ub294 JavaScript\uc5d0 \uc815\uc801 \ud0c0\uc785 \uc2dc\uc2a4\ud15c\uc744 \ucd94\uac00\ud55c \ud504\ub85c\uadf8\ub798\ubc0d \uc5b8\uc5b4<\/strong>\ub2e4. Microsoft\uc5d0\uc11c \uac1c\ubc1c\ud588\uc73c\uba70, JavaScript \uc0dd\ud0dc\uacc4\ub97c \uadf8\ub300\ub85c \uc0ac\uc6a9\ud558\uba74\uc11c \uaddc\ubaa8\uac00 \ucee4\uc84c\uc744 \ub54c \ubc1c\uc0dd\ud558\ub294 \ud0c0\uc785 \uad00\ub828 \ubb38\uc81c\ub97c \uc904\uc774\ub294 \uac83\uc744 \uc8fc\uc694 \ubaa9\uc801\uc73c\ub85c \ud55c\ub2e4.<\/p>\n\n\n\n

TypeScript\uc758 \uac00\uc7a5 \uc911\uc694\ud55c \ud2b9\uc9d5\uc740 \ube0c\ub77c\uc6b0\uc800\ub098 Node.js\uac00 TypeScript\ub97c \uc9c1\uc811 \uc2e4\ud589\ud558\ub294 \uac83\uc774 \uc544\ub2c8\ub77c\ub294 \uc810<\/strong>\uc774\ub2e4.<\/p>\n\n\n\n

\uc791\uc131\ud55c TypeScript \ucf54\ub4dc\ub294 \uba3c\uc800 JavaScript\ub85c \ubcc0\ud658\ub41c\ub2e4.<\/p>\n\n\n\n

TypeScript -> TypeScript Compiler -> JavaScript -> Browser \/ Node.js \/ Runtime<\/code><\/pre>\n\n\n\n
\ub530\ub77c\uc11c TypeScript\ub294 JavaScript\ub97c \ub300\uccb4\ud558\ub294 \ubcc4\ub3c4\uc758 \uc2e4\ud589 \ud658\uacbd\uc774\ub77c\uae30\ubcf4\ub2e4 JavaScript \ud504\ub85c\uadf8\ub7a8\uc744 \ub354 \uc548\uc804\ud558\uac8c \uc791\uc131\ud558\uae30 \uc704\ud55c \uc5b8\uc5b4\uc640 \uac1c\ubc1c \ub3c4\uad6c\uc758 \uc9d1\ud569<\/strong>\uc5d0 \uac00\uae5d\ub2e4.<\/p>\n\n\n\n
\ud2b9\ud788 \ud504\ub85c\uc81d\ud2b8 \uaddc\ubaa8\uac00 \ucee4\uc9c0\uba74\uc11c \ud568\uc218\uc758 \uc785\ub825\uacfc \ucd9c\ub825, \uac1d\uccb4\uc758 \uad6c\uc870, API \ub370\uc774\ud130 \ud615\ud0dc \ub4f1\uc744 \ucf54\ub4dc \uc218\uc900\uc5d0\uc11c \uba85\ud655\ud558\uac8c \uad00\ub9ac\ud574\uc57c \ud560 \ub54c TypeScript\uc758 \uac00\uce58\uac00 \ucee4\uc9c4\ub2e4.<\/p>\n\n\n\n
\n\n\n\n
JavaScript\uc640 TypeScript<\/h2>\n\n\n\n
JavaScript\ub294 \uae30\ubcf8\uc801\uc73c\ub85c \ub3d9\uc801 \ud0c0\uc785 \uc5b8\uc5b4\ub2e4.<\/p>\n\n\n\n
let value = 10;\n\nvalue = \"Hello\";<\/code><\/pre>\n\n\n\n
\ud558\ub098\uc758 \ubcc0\uc218\uc5d0 \uc11c\ub85c \ub2e4\ub978 \ud0c0\uc785\uc758 \uac12\uc744 \ub123\uc744 \uc218 \uc788\ub2e4.<\/p>\n\n\n\n
TypeScript\uc5d0\uc11c\ub294 \ud0c0\uc785\uc744 \uba85\uc2dc\ud560 \uc218 \uc788\ub2e4.<\/p>\n\n\n\n
let value: number = 10;\n\n\/\/ value = \"Hello\";<\/code><\/pre>\n\n\n\n
\uc774 \ucf54\ub4dc\ub294 \ucef4\ud30c\uc77c \uacfc\uc815\uc5d0\uc11c \ud0c0\uc785 \uc624\ub958\uac00 \ubc1c\uc0dd\ud55c\ub2e4.<\/p>\n\n\n\n
\ub2e4\ub9cc TypeScript\uc758 \ud0c0\uc785 \uac80\uc0ac\ub294 \uc2e4\ud589 \uc911\uc5d0 \uc774\ub8e8\uc5b4\uc9c0\ub294 \uac83\uc774 \uc544\ub2c8\ub2e4.<\/strong><\/p>\n\n\n\n
TypeScript -> Type Checking -> JavaScript \uc0dd\uc131 -> \uc2e4\ud589<\/code><\/pre>\n\n\n\n
\ud0c0\uc785 \uc815\ubcf4\ub294 \uc77c\ubc18\uc801\uc73c\ub85c JavaScript\ub85c \ubcc0\ud658\ub420 \ub54c \uc81c\uac70\ub41c\ub2e4.<\/p>\n\n\n\n
\ub530\ub77c\uc11c TypeScript\uc758 \ud0c0\uc785 \uc2dc\uc2a4\ud15c\uc740 \uc8fc\ub85c \uac1c\ubc1c \ub2e8\uacc4\uc5d0\uc11c \uc624\ub958\ub97c \ubc1c\uacac\ud558\ub294 \uc5ed\ud560<\/strong>\uc744 \ud55c\ub2e4.<\/p>\n\n\n\n
\n\n\n\n
\uae30\ubcf8 \ud0c0\uc785<\/h2>\n\n\n\n
TypeScript\uc5d0\ub294 JavaScript\uc758 \uae30\ubcf8 \uac12\uc5d0 \ub300\uc751\ud558\ub294 \ud0c0\uc785\ub4e4\uc774 \uc788\ub2e4.<\/p>\n\n\n\n
let name: string = \"Player\";\nlet age: number = 24;\nlet alive: boolean = true;<\/code><\/pre>\n\n\n\n
\ubc30\uc5f4\ub3c4 \ud0c0\uc785\uc744 \uc9c0\uc815\ud560 \uc218 \uc788\ub2e4.<\/p>\n\n\n\n
let scores: number[] = [10, 20, 30];\n\nlet names: Array<string> = [\n    \"A\",\n    \"B\",\n    \"C\"\n];<\/code><\/pre>\n\n\n\n
\uac1d\uccb4\ub294 \uad6c\uc870\ub97c \uae30\uc900\uc73c\ub85c \ud0c0\uc785\uc744 \uc815\uc758\ud560 \uc218 \uc788\ub2e4.<\/p>\n\n\n\n
let player: {\n    name: string;\n    health: number;\n} = {\n    name: \"Knight\",\n    health: 100\n};<\/code><\/pre>\n\n\n\n
\ud558\uc9c0\ub9cc \uc2e4\uc81c \ud504\ub85c\uc81d\ud2b8\uc5d0\uc11c\ub294 \uc774\ub7f0 \uac1d\uccb4 \ud0c0\uc785\uc744 \ubc18\ubcf5\ud574\uc11c \uc791\uc131\ud558\uae30\ubcf4\ub2e4 interface<\/code>\ub098 type<\/code>\uc744 \uc0ac\uc6a9\ud558\ub294 \uacbd\uc6b0\uac00 \ub9ce\ub2e4.<\/p>\n\n\n\n
\n\n\n\n
Type Inference<\/h2>\n\n\n\n
TypeScript\ub294 \ud0c0\uc785\uc744 \ud56d\uc0c1 \uc9c1\uc811 \uc791\uc131\ud560 \ud544\uc694\uac00 \uc5c6\ub2e4.<\/p>\n\n\n\n
let health = 100;\nlet name = \"Player\";<\/code><\/pre>\n\n\n\n
TypeScript\uac00 \ucd08\uae30\uac12\uc744 \ubcf4\uace0 \ud0c0\uc785\uc744 \ucd94\ub860\ud55c\ub2e4.<\/p>\n\n\n\n
health -> number\nname -> string<\/code><\/pre>\n\n\n\n
\ud568\uc218\uc758 \ubc18\ud658 \ud0c0\uc785\ub3c4 \ucd94\ub860\ud560 \uc218 \uc788\ub2e4.<\/p>\n\n\n\n
function add(a: number, b: number) {\n    return a + b;\n}<\/code><\/pre>\n\n\n\n
\ubc18\ud658\uac12\uc774 number<\/code>\ub77c\ub294 \uac83\uc744 \ucef4\ud30c\uc77c\ub7ec\uac00 \uc54c \uc218 \uc788\ub2e4.<\/p>\n\n\n\n
\ub530\ub77c\uc11c \ud0c0\uc785\uc744 \ubb34\uc870\uac74 \ubaa8\ub4e0 \uacf3\uc5d0 \ubd99\uc774\ub294 \uac83\ubcf4\ub2e4 \ucef4\ud30c\uc77c\ub7ec\uac00 \uba85\ud655\ud558\uac8c \ucd94\ub860\ud560 \uc218 \uc788\ub294 \uacf3\uc740 \ub9e1\uae30\uace0, \uc678\ubd80 \uacbd\uacc4\ub098 \uc758\ub3c4\uac00 \ud544\uc694\ud55c \uacf3\uc5d0 \ud0c0\uc785\uc744 \uba85\uc2dc\ud558\ub294 \ubc29\uc2dd<\/strong>\uc774 \uc2e4\uc6a9\uc801\uc774\ub2e4.<\/p>\n\n\n\n
\n\n\n\n
\ud568\uc218<\/h2>\n\n\n\n
\ud568\uc218\uc758 \ub9e4\uac1c\ubcc0\uc218\uc640 \ubc18\ud658 \ud0c0\uc785\uc744 \uc9c0\uc815\ud560 \uc218 \uc788\ub2e4.<\/p>\n\n\n\n
function add(\n    a: number,\n    b: number\n): number {\n    return a + b;\n}<\/code><\/pre>\n\n\n\n
\ubc18\ud658\uac12\uc774 \uc5c6\ub294 \ud568\uc218\ub294 void<\/code>\ub97c \uc0ac\uc6a9\ud560 \uc218 \uc788\ub2e4.<\/p>\n\n\n\n
function log(message: string): void {\n    console.log(message);\n}<\/code><\/pre>\n\n\n\n
\ud568\uc218 \uc790\uccb4\ub3c4 \ud0c0\uc785\uc73c\ub85c \ud45c\ud604\ud560 \uc218 \uc788\ub2e4.<\/p>\n\n\n\n
let operation: (a: number, b: number) => number;\n\noperation = (a, b) => a + b;<\/code><\/pre>\n\n\n\n
\ud568\uc218\ub97c \uac12\ucc98\ub7fc \uc804\ub2ec\ud560 \uc218 \uc788\ub2e4\ub294 JavaScript\uc758 \ud2b9\uc131\uc744 TypeScript\uc5d0\uc11c\ub3c4 \uadf8\ub300\ub85c \uc0ac\uc6a9\ud560 \uc218 \uc788\ub2e4.<\/p>\n\n\n\n
\n\n\n\n
Optional Parameter<\/h2>\n\n\n\n
\ub9e4\uac1c\ubcc0\uc218 \ub4a4\uc5d0 ?<\/code>\ub97c \ubd99\uc774\uba74 \uc120\ud0dd\uc801 \ub9e4\uac1c\ubcc0\uc218\uac00 \ub41c\ub2e4.<\/p>\n\n\n\n
function greet(name?: string) {\n    console.log(name);\n}<\/code><\/pre>\n\n\n\n
\ud638\ucd9c\ud560 \ub54c \uc0dd\ub7b5\ud560 \uc218 \uc788\ub2e4.<\/p>\n\n\n\n
greet();\ngreet(\"Player\");<\/code><\/pre>\n\n\n\n
\uc774\ub54c name<\/code>\uc758 \ud0c0\uc785\uc740 \uc0ac\uc2e4\uc0c1 \ub2e4\uc74c\uacfc \uac19\uc774 \ucde8\uae09\ub41c\ub2e4.<\/p>\n\n\n\n
string | undefined<\/code><\/pre>\n\n\n\n
\ub530\ub77c\uc11c \uac12\uc774 \uc874\uc7ac\ud558\uc9c0 \uc54a\ub294 \uc0c1\ud669\uc744 \uace0\ub824\ud574\uc57c \ud55c\ub2e4.<\/p>\n\n\n\n
\n\n\n\n
Union Type<\/h2>\n\n\n\n
\ud558\ub098\uc758 \uac12\uc774 \uc5ec\ub7ec \ud0c0\uc785 \uc911 \ud558\ub098\uac00 \ub420 \uc218 \uc788\ub2e4\uba74 Union Type\uc744 \uc0ac\uc6a9\ud55c\ub2e4.<\/p>\n\n\n\n
let value: string | number;\n\nvalue = \"Hello\";\nvalue = 100;<\/code><\/pre>\n\n\n\n
\ud568\uc218\uc5d0\uc11c\ub3c4 \uc0ac\uc6a9\ud560 \uc218 \uc788\ub2e4.<\/p>\n\n\n\n
function print(value: string | number) {\n    console.log(value);\n}<\/code><\/pre>\n\n\n\n
Union Type\uc740 API \uc751\ub2f5\uc774\ub098 \uc5ec\ub7ec \uc0c1\ud0dc\ub97c \ud45c\ud604\ud560 \ub54c \uc790\uc8fc \uc0ac\uc6a9\ud55c\ub2e4.<\/p>\n\n\n\n
type Result = string | null;<\/code><\/pre>\n\n\n\n
\n\n\n\n
Type Narrowing<\/h2>\n\n\n\n
Union Type\uc744 \uc0ac\uc6a9\ud558\uba74 \uc2e4\uc81c \ud0c0\uc785\uc744 \ud655\uc778\ud55c \ub4a4 \uadf8\uc5d0 \ub9de\ub294 \ucf54\ub4dc\ub97c \uc791\uc131\ud574\uc57c \ud55c\ub2e4.<\/p>\n\n\n\n
function print(value: string | number) {\n    if (typeof value === \"string\") {\n        console.log(value.toUpperCase());\n    }\n    else {\n        console.log(value.toFixed(2));\n    }\n}<\/code><\/pre>\n\n\n\n
typeof<\/code> \uac80\uc0ac \uc774\ud6c4 TypeScript\uac00 \ud0c0\uc785\uc744 \uc881\ud600\uc900\ub2e4.<\/p>\n\n\n\n
\uc774\uac83\uc744 Type Narrowing<\/strong>\uc774\ub77c\uace0 \ud55c\ub2e4.<\/p>\n\n\n\n
\uac1d\uccb4\uc5d0\uc11c\ub3c4 \uc0ac\uc6a9\ud560 \uc218 \uc788\ub2e4.<\/p>\n\n\n\n
if (player instanceof Player) {\n    player.attack();\n}<\/code><\/pre>\n\n\n\n
\uc774\ub7f0 \ubc29\uc2dd\uc73c\ub85c \ub7f0\ud0c0\uc784\uc758 \uc870\uac74\uacfc TypeScript\uc758 \ud0c0\uc785 \uc2dc\uc2a4\ud15c\uc744 \uc5f0\uacb0\ud560 \uc218 \uc788\ub2e4.<\/p>\n\n\n\n
\n\n\n\n
Interface<\/h2>\n\n\n\n
\uac1d\uccb4\uc758 \uad6c\uc870\ub97c \uc815\uc758\ud560 \ub54c interface<\/code>\ub97c \uc0ac\uc6a9\ud560 \uc218 \uc788\ub2e4.<\/p>\n\n\n\n
interface Player {\n    id: number;\n    name: string;\n    health: number;\n}<\/code><\/pre>\n\n\n\n
\uc774\uc81c \ud574\ub2f9 \uad6c\uc870\ub97c \uc0ac\uc6a9\ud558\ub294 \uac1d\uccb4\ub97c \ub9cc\ub4e4 \uc218 \uc788\ub2e4.<\/p>\n\n\n\n
const player: Player = {\n    id: 1,\n    name: \"Knight\",\n    health: 100\n};<\/code><\/pre>\n\n\n\n
\ud568\uc218\uc758 \ub9e4\uac1c\ubcc0\uc218\uc5d0\ub3c4 \uc0ac\uc6a9\ud560 \uc218 \uc788\ub2e4.<\/p>\n\n\n\n
function attack(player: Player) {\n    console.log(player.name);\n}<\/code><\/pre>\n\n\n\n
\uc778\ud130\ud398\uc774\uc2a4\uc758 \ubaa9\uc801\uc740 \ud074\ub798\uc2a4 \uc790\uccb4\ub97c \uc815\uc758\ud558\ub294 \uac83\uc774 \uc544\ub2c8\ub77c \uac1d\uccb4\uac00 \uc5b4\ub5a4 \uad6c\uc870\ub97c \uac00\uc838\uc57c \ud558\ub294\uc9c0 \uacc4\uc57d\uc744 \ud45c\ud604\ud558\ub294 \uac83<\/strong>\uc5d0 \uac00\uae5d\ub2e4.<\/p>\n\n\n\n
\n\n\n\n
Optional Property<\/h2>\n\n\n\n
\ud504\ub85c\ud37c\ud2f0 \ub4a4\uc5d0 ?<\/code>\ub97c \ubd99\uc774\uba74 \ud574\ub2f9 \ud504\ub85c\ud37c\ud2f0\ub97c \uc0dd\ub7b5\ud560 \uc218 \uc788\ub2e4.<\/p>\n\n\n\n
interface Player {\n    name: string;\n    level?: number;\n}<\/code><\/pre>\n\n\n\n
\ub2e4\uc74c \ub450 \uac1d\uccb4 \ubaa8\ub450 \uc720\ud6a8\ud558\ub2e4.<\/p>\n\n\n\n
const a: Player = {\n    name: \"A\"\n};\n\nconst b: Player = {\n    name: \"B\",\n    level: 10\n};<\/code><\/pre>\n\n\n\n
\uc0ac\uc6a9\ud560 \ub54c\ub294 level<\/code>\uc774 \uc874\uc7ac\ud558\uc9c0 \uc54a\uc744 \uac00\ub2a5\uc131\uc744 \uace0\ub824\ud574\uc57c \ud55c\ub2e4.<\/p>\n\n\n\n
\n\n\n\n
readonly<\/h2>\n\n\n\n
\ud504\ub85c\ud37c\ud2f0\ub97c \uc77d\uae30 \uc804\uc6a9\uc73c\ub85c \ub9cc\ub4e4 \uc218\ub3c4 \uc788\ub2e4.<\/p>\n\n\n\n
interface Player {\n    readonly id: number;\n    name: string;\n}<\/code><\/pre>\n\n\n\n
\uac1d\uccb4 \uc0dd\uc131 \uc774\ud6c4 id<\/code>\ub97c \ubcc0\uacbd\ud558\ub824 \ud558\uba74 TypeScript\uc5d0\uc11c \uc624\ub958\uac00 \ubc1c\uc0dd\ud55c\ub2e4.<\/p>\n\n\n\n
player.id = 10;<\/code><\/pre>\n\n\n\n
\ub2e4\ub9cc readonly<\/code> \uc5ed\uc2dc TypeScript\uc758 \ud0c0\uc785 \uc2dc\uc2a4\ud15c\uc5d0 \uc18d\ud558\ub294 \uae30\ub2a5\uc774\ub2e4. \ub7f0\ud0c0\uc784\uc5d0\uc11c JavaScript \uac1d\uccb4\uc758 \ubcc0\uacbd \uc790\uccb4\ub97c \uac15\uc81c\ub85c \ub9c9\ub294 \uae30\ub2a5\uacfc\ub294 \ub2e4\ub974\ub2e4.<\/p>\n\n\n\n
\n\n\n\n
Type Alias<\/h2>\n\n\n\n
type<\/code>\uc744 \uc0ac\uc6a9\ud574\uc11c \ud0c0\uc785\uc5d0 \uc774\ub984\uc744 \ubd99\uc77c \uc218\ub3c4 \uc788\ub2e4.<\/p>\n\n\n\n
type Player = {\n    id: number;\n    name: string;\n    health: number;\n};<\/code><\/pre>\n\n\n\n
\uac04\ub2e8\ud55c \uac1d\uccb4 \ud0c0\uc785\ubfd0\ub9cc \uc544\ub2c8\ub77c Union Type\ub3c4 \ud45c\ud604\ud560 \uc218 \uc788\ub2e4.<\/p>\n\n\n\n
type State =\n    | \"idle\"\n    | \"move\"\n    | \"attack\"\n    | \"dead\";<\/code><\/pre>\n\n\n\n
\uc774\uc81c State<\/code>\ub294 \ub124 \uac00\uc9c0 \ubb38\uc790\uc5f4 \uc911 \ud558\ub098\ub9cc \ud5c8\uc6a9\ud55c\ub2e4.<\/p>\n\n\n\n
let state: State = \"idle\";<\/code><\/pre>\n\n\n\n
\uac8c\uc784 \uc0c1\ud0dc\ub098 UI \uc0c1\ud0dc\ucc98\ub7fc \ud5c8\uc6a9 \uac00\ub2a5\ud55c \uac12\uc758 \ubc94\uc704\uac00 \uba85\ud655\ud55c \uacbd\uc6b0<\/strong> \uc0c1\ub2f9\ud788 \uc720\uc6a9\ud558\ub2e4.<\/p>\n\n\n\n
\n\n\n\n
Interface\uc640 Type<\/h2>\n\n\n\n
\ub458\uc740 \uc0c1\ub2f9\ud788 \ube44\uc2b7\ud55c \uc6a9\ub3c4\ub85c \uc0ac\uc6a9\ud560 \uc218 \uc788\ub2e4.<\/p>\n\n\n\n
interface Player {\n    name: string;\n}\n\ntype Player = {\n    name: string;\n};<\/code><\/pre>\n\n\n\n
\uc77c\ubc18\uc801\uc778 \uac1d\uccb4 \uad6c\uc870\ub97c \ud45c\ud604\ud560 \ub54c\ub294 \ub458 \ub2e4 \uc0ac\uc6a9\ud560 \uc218 \uc788\ub2e4.<\/p>\n\n\n\n
\ucc28\uc774\uc810\uc740 \uc138\ubd80\uc801\uc778 \ud0c0\uc785 \uc2dc\uc2a4\ud15c\uc5d0 \uc788\ub2e4.<\/p>\n\n\n\n
type<\/code>\uc740 Union\uc774\ub098 Primitive Alias \uac19\uc740 \ud0c0\uc785 \uc870\ud569\uc5d0 \uc790\uc5f0\uc2a4\ub7fd\ub2e4.<\/p>\n\n\n\n
type ID = string | number;<\/code><\/pre>\n\n\n\n
interface<\/code>\ub294 \uac1d\uccb4 \uad6c\uc870\ub97c \uc815\uc758\ud558\uace0 \ud655\uc7a5\ud558\ub294 \ud615\ud0dc\uc5d0\uc11c \uc790\uc5f0\uc2a4\ub7fd\ub2e4.<\/p>\n\n\n\n
interface Entity {\n    id: number;\n}\n\ninterface Player extends Entity {\n    name: string;\n}<\/code><\/pre>\n\n\n\n
\ud504\ub85c\uc81d\ud2b8\uc5d0\uc11c\ub294 \ub458 \uc911 \ud558\ub098\ub9cc \uace0\uc9d1\ud558\uae30\ubcf4\ub2e4 \ubaa9\uc801\uc5d0 \ub9de\uac8c \uc0ac\uc6a9\ud558\ub294 \ud3b8\uc774 \uc88b\ub2e4.<\/p>\n\n\n\n
\n\n\n\n
Intersection Type<\/h2>\n\n\n\n
\uc5ec\ub7ec \ud0c0\uc785\uc744 \ud569\uce60 \uc218\ub3c4 \uc788\ub2e4.<\/p>\n\n\n\n
type Position = {\n    x: number;\n    y: number;\n};\n\ntype Entity = {\n    id: number;\n};\n\ntype GameObject = Position & Entity;<\/code><\/pre>\n\n\n\n
\uc774\uc81c GameObject<\/code>\ub294 \uc138 \uac00\uc9c0 \ud504\ub85c\ud37c\ud2f0\ub97c \ubaa8\ub450 \uac00\uc838\uc57c \ud55c\ub2e4.<\/p>\n\n\n\n
const object: GameObject = {\n    id: 1,\n    x: 100,\n    y: 200\n};<\/code><\/pre>\n\n\n\n
Union\uc774 “A \ub610\ub294 B”\ub77c\uba74 Intersection\uc740 “A\uc640 B\ub97c \ubaa8\ub450 \ub9cc\uc871”\ud558\ub294 \uad6c\uc870\ub2e4.<\/p>\n\n\n\n
A | B -> A \ub610\ub294 B\nA & B -> A\uc640 B \ubaa8\ub450<\/code><\/pre>\n\n\n\n
\n\n\n\n
Class<\/h2>\n\n\n\n
TypeScript\ub294 JavaScript\uc758 Class \ubb38\ubc95\uc5d0 \ud0c0\uc785 \uc2dc\uc2a4\ud15c\uc744 \uacb0\ud569\ud55c\ub2e4.<\/p>\n\n\n\n
class Player {\n    name: string;\n    health: number;\n\n    constructor(name: string, health: number) {\n        this.name = name;\n        this.health = health;\n    }\n\n    attack(): void {\n        console.log(\"Attack\");\n    }\n}<\/code><\/pre>\n\n\n\n
\uac1d\uccb4\ub97c \uc0dd\uc131\ud55c\ub2e4.<\/p>\n\n\n\n
const player = new Player(\n    \"Knight\",\n    100\n);<\/code><\/pre>\n\n\n\n
JavaScript\uc758 Class\uc640 \uae30\ubcf8 \uad6c\uc870\ub294 \ube44\uc2b7\ud558\uc9c0\ub9cc \uc811\uadfc \uc81c\ud55c\uc790\uc640 \ud0c0\uc785 \uc9c0\uc815 \ub4f1\uc758 \uae30\ub2a5\uc774 \ucd94\uac00\ub41c\ub2e4.<\/p>\n\n\n\n
\n\n\n\n
\uc811\uadfc \uc81c\ud55c\uc790<\/h2>\n\n\n\n
TypeScript\uc5d0\uc11c\ub294 \ub2e4\uc74c \uc811\uadfc \uc81c\ud55c\uc790\ub97c \uc0ac\uc6a9\ud560 \uc218 \uc788\ub2e4.<\/p>\n\n\n\n
public \/ private \/ protected<\/code><\/pre>\n\n\n\n
class Player {\n    public name: string;\n    private health: number;\n    protected level: number;\n\n    constructor() {\n        this.name = \"Player\";\n        this.health = 100;\n        this.level = 1;\n    }\n}<\/code><\/pre>\n\n\n\n
private<\/code>\ub294 \ud074\ub798\uc2a4 \uc678\ubd80\uc5d0\uc11c \uc9c1\uc811 \uc811\uadfc\ud560 \uc218 \uc5c6\ub3c4\ub85d \ud0c0\uc785 \uc2dc\uc2a4\ud15c\uc5d0\uc11c \uc81c\ud55c\ud55c\ub2e4.<\/p>\n\n\n\n
player.health = 0;<\/code><\/pre>\n\n\n\n
\ucef4\ud30c\uc77c \uc2dc \uc624\ub958\uac00 \ubc1c\uc0dd\ud55c\ub2e4.<\/p>\n\n\n\n
\ub2e4\ub9cc TypeScript\uc758 private<\/code>\uc640 JavaScript\uc758 ECMAScript #private<\/code> \ud544\ub4dc\ub294 \uc131\uaca9\uc774 \ub2e4\ub974\ub2e4. \ub7f0\ud0c0\uc784 \uc218\uc900\uc758 \uc9c4\uc9dc private \ud544\ub4dc\uac00 \ud544\uc694\ud55c \uacbd\uc6b0\uc5d0\ub294 #<\/code> \ubb38\ubc95\uc744 \uc0ac\uc6a9\ud560 \uc218\ub3c4 \uc788\ub2e4.<\/p>\n\n\n\n
\n\n\n\n
\uc0c1\uc18d<\/h2>\n\n\n\n
TypeScript\ub3c4 \ud074\ub798\uc2a4 \uc0c1\uc18d\uc744 \uc9c0\uc6d0\ud55c\ub2e4.<\/p>\n\n\n\n
class Character {\n    attack(): void {\n        console.log(\"Character Attack\");\n    }\n}\n\nclass Player extends Character {\n    attack(): void {\n        console.log(\"Player Attack\");\n    }\n}<\/code><\/pre>\n\n\n\n
\uc778\ud130\ud398\uc774\uc2a4 \uad6c\ud604\uc740 implements<\/code>\ub97c \uc0ac\uc6a9\ud55c\ub2e4.<\/p>\n\n\n\n
interface Damageable {\n    takeDamage(amount: number): void;\n}\n\nclass Player implements Damageable {\n    takeDamage(amount: number): void {\n        console.log(amount);\n    }\n}<\/code><\/pre>\n\n\n\n
\uc0c1\uc18d \uad00\uacc4\ub294 extends<\/code>, \uc778\ud130\ud398\uc774\uc2a4 \uad6c\ud604\uc740 implements<\/code>\ub85c \uad6c\ubd84\ud55c\ub2e4.<\/p>\n\n\n\n
\n\n\n\n
Generic<\/h2>\n\n\n\n
TypeScript\uc5d0\uc11c \uc0c1\ub2f9\ud788 \uc911\uc694\ud55c \uae30\ub2a5\uc774\ub2e4.<\/p>\n\n\n\n
\uac19\uc740 \uad6c\uc870\ub97c \uc5ec\ub7ec \ud0c0\uc785\uc5d0\uc11c \uc0ac\uc6a9\ud558\uba74\uc11c \ud0c0\uc785 \uc548\uc815\uc131\uc744 \uc720\uc9c0\ud560 \uc218 \uc788\ub2e4.<\/p>\n\n\n\n
function identity<T>(value: T): T {\n    return value;\n}<\/code><\/pre>\n\n\n\n
\uc0ac\uc6a9\ud558\uba74:<\/p>\n\n\n\n
const a = identity(10);\nconst b = identity(\"Hello\");<\/code><\/pre>\n\n\n\n
\uac01\uac01 number<\/code>, string<\/code>\uc73c\ub85c \ucd94\ub860\ub41c\ub2e4.<\/p>\n\n\n\n
\uceec\ub809\uc158\uc5d0\uc11c\ub3c4 \uc0ac\uc6a9\ud55c\ub2e4.<\/p>\n\n\n\n
const players: Array<Player> = [];\nconst scores: Array<number> = [];<\/code><\/pre>\n\n\n\n
Generic\uc744 \uc0ac\uc6a9\ud558\uba74 any<\/code>\ub97c \uc0ac\uc6a9\ud558\ub294 \uac83\ubcf4\ub2e4 \ud6e8\uc52c \uc548\uc804\ud558\uac8c \uc7ac\uc0ac\uc6a9 \uac00\ub2a5\ud55c \ucf54\ub4dc\ub97c \ub9cc\ub4e4 \uc218 \uc788\ub2e4.<\/p>\n\n\n\n
\n\n\n\n
Generic Constraint<\/h2>\n\n\n\n
Generic\uc5d0 \uc0ac\uc6a9\ud560 \uc218 \uc788\ub294 \ud0c0\uc785\uc744 \uc81c\ud55c\ud560 \uc218\ub3c4 \uc788\ub2e4.<\/p>\n\n\n\n
interface Entity {\n    id: number;\n}\n\nfunction printId<T extends Entity>(entity: T) {\n    console.log(entity.id);\n}<\/code><\/pre>\n\n\n\n
T<\/code>\ub294 \ubc18\ub4dc\uc2dc Entity<\/code>\uc758 \uad6c\uc870\ub97c \ub9cc\uc871\ud574\uc57c \ud55c\ub2e4.<\/p>\n\n\n\n
\uc774\ub7f0 \ubc29\uc2dd\uc73c\ub85c Generic\uc758 \uc720\uc5f0\uc131\uacfc \ud0c0\uc785 \uc548\uc815\uc131\uc744 \ub3d9\uc2dc\uc5d0 \uac00\uc838\uac08 \uc218 \uc788\ub2e4.<\/p>\n\n\n\n
\n\n\n\n
any<\/h2>\n\n\n\n
any<\/code>\ub294 TypeScript\uc758 \ud0c0\uc785 \uac80\uc0ac\ub97c \uc0ac\uc2e4\uc0c1 \ud574\uc81c\ud55c\ub2e4.<\/p>\n\n\n\n
let value: any = 10;\n\nvalue = \"Hello\";\nvalue = {};\nvalue.foo.bar();<\/code><\/pre>\n\n\n\n
\ucef4\ud30c\uc77c\ub7ec\uac00 \ud0c0\uc785 \uc624\ub958\ub97c \uac70\uc758 \uac80\uc0ac\ud558\uc9c0 \uc54a\ub294\ub2e4.<\/p>\n\n\n\n
JavaScript \ucf54\ub4dc\ub97c \ube60\ub974\uac8c TypeScript\ub85c \uc62e\uae38 \ub54c \uc784\uc2dc\ub85c \uc0ac\uc6a9\ud560 \uc218 \uc788\uc9c0\ub9cc, \ud504\ub85c\uc81d\ud2b8 \uc804\uccb4\uc5d0 any<\/code>\uac00 \ud37c\uc9c0\uba74 TypeScript\ub97c \uc0ac\uc6a9\ud558\ub294 \uc758\ubbf8\uac00 \ud06c\uac8c \uc904\uc5b4\ub4e0\ub2e4.<\/p>\n\n\n\n
\uac00\ub2a5\ud558\uba74 \uc815\ud655\ud55c \ud0c0\uc785\uc774\ub098 unknown<\/code>\uc744 \uc0ac\uc6a9\ud558\ub294 \ud3b8\uc774 \ub0ab\ub2e4.<\/p>\n\n\n\n
\n\n\n\n
unknown<\/h2>\n\n\n\n
unknown<\/code>\ub3c4 \uc5b4\ub5a4 \uac12\uc774\ub4e0 \ubc1b\uc744 \uc218 \uc788\uc9c0\ub9cc any<\/code>\ubcf4\ub2e4 \uc548\uc804\ud558\ub2e4.<\/p>\n\n\n\n
let value: unknown;\n\nvalue = 10;\nvalue = \"Hello\";<\/code><\/pre>\n\n\n\n
\ud558\uc9c0\ub9cc \ubc14\ub85c \uba54\uc11c\ub4dc\ub97c \ud638\ucd9c\ud560 \uc218 \uc5c6\ub2e4.<\/p>\n\n\n\n
value.toUpperCase();<\/code><\/pre>\n\n\n\n
\uba3c\uc800 \ud0c0\uc785\uc744 \ud655\uc778\ud574\uc57c \ud55c\ub2e4.<\/p>\n\n\n\n
if (typeof value === \"string\") {\n    value.toUpperCase();\n}<\/code><\/pre>\n\n\n\n
\uc678\ubd80\uc5d0\uc11c \ub4e4\uc5b4\uc624\ub294 \uac12\uc744 \uc544\uc9c1 \uac80\uc99d\ud558\uc9c0 \uc54a\uc740 \uc0c1\ud0dc\ub85c \ub2e4\ub8f0 \ub54c unknown<\/code>\uc774 \uc801\ud569\ud558\ub2e4.<\/p>\n\n\n\n
\n\n\n\n
never<\/h2>\n\n\n\n
never<\/code>\ub294 \uc815\uc0c1\uc801\uc73c\ub85c \uac12\uc744 \ubc18\ud658\ud558\uc9c0 \uc54a\ub294 \uacbd\uc6b0\ub97c \ud45c\ud604\ud55c\ub2e4.<\/p>\n\n\n\n
\ub300\ud45c\uc801\uc73c\ub85c \ud56d\uc0c1 \uc608\uc678\ub97c \ubc1c\uc0dd\uc2dc\ud0a4\ub294 \ud568\uc218\ub2e4.<\/p>\n\n\n\n
function fail(message: string): never {\n    throw new Error(message);\n}<\/code><\/pre>\n\n\n\n
\ub610\ub294 \ubaa8\ub4e0 \uacbd\uc6b0\ub97c \ucc98\ub9ac\ud55c \uc774\ud6c4 \ub354 \uc774\uc0c1 \ub3c4\ub2ec\ud560 \uc218 \uc5c6\ub294 \uc0c1\ud0dc\ub97c \ud45c\ud604\ud560 \ub54c \uc0ac\uc6a9\ud560 \uc218 \uc788\ub2e4.<\/p>\n\n\n\n
Exhaustive Check\uc5d0\uc11c\ub3c4 \ud65c\uc6a9\ub41c\ub2e4.<\/p>\n\n\n\n
type State = \"idle\" | \"attack\";\n\nfunction handle(state: State) {\n    switch (state) {\n        case \"idle\":\n            break;\n\n        case \"attack\":\n            break;\n\n        default:\n            const exhaustive: never = state;\n            return exhaustive;\n    }\n}<\/code><\/pre>\n\n\n\n
\uc0c8\ub85c\uc6b4 \uc0c1\ud0dc\uac00 \ucd94\uac00\ub418\uc5c8\ub294\ub370 switch<\/code>\uc5d0\uc11c \ucc98\ub9ac\ud558\uc9c0 \uc54a\uc558\ub2e4\uba74 \ud0c0\uc785 \uc624\ub958\ub97c \ubc1c\uc0dd\uc2dc\ud0ac \uc218 \uc788\ub2e4.<\/p>\n\n\n\n
\n\n\n\n
Optional Chaining<\/h2>\n\n\n\n
JavaScript\uc5d0\ub3c4 \uc874\uc7ac\ud558\ub294 \uae30\ub2a5\uc73c\ub85c TypeScript\uc5d0\uc11c\ub3c4 \uc0ac\uc6a9\ud560 \uc218 \uc788\ub2e4.<\/p>\n\n\n\n
const name = player?.name;<\/code><\/pre>\n\n\n\n
player<\/code>\uac00 null<\/code> \ub610\ub294 undefined<\/code>\ub77c\uba74 \uc811\uadfc\uc744 \uc911\ub2e8\ud55c\ub2e4.<\/p>\n\n\n\n
\uc911\ucca9\ub41c \uac1d\uccb4\uc5d0\uc11c\ub3c4 \uc0ac\uc6a9\ud560 \uc218 \uc788\ub2e4.<\/p>\n\n\n\n
const value =\n    player?.inventory?.items?.[0];<\/code><\/pre>\n\n\n\n
Null\uc774\ub098 Undefined\uac00 \uc874\uc7ac\ud560 \uc218 \uc788\ub294 \ub370\uc774\ud130\ub97c \ub2e4\ub8f0 \ub54c \uc720\uc6a9\ud558\ub2e4.<\/p>\n\n\n\n
\n\n\n\n
Nullish Coalescing<\/h2>\n\n\n\n
??<\/code>\ub97c \uc0ac\uc6a9\ud558\uba74 \uac12\uc774 null<\/code> \ub610\ub294 undefined<\/code>\uc77c \ub54c \uae30\ubcf8\uac12\uc744 \uc0ac\uc6a9\ud560 \uc218 \uc788\ub2e4.<\/p>\n\n\n\n
const level =\n    player.level ?? 1;<\/code><\/pre>\n\n\n\n
||<\/code>\uc640 \ucc28\uc774\uac00 \uc788\ub2e4.<\/p>\n\n\n\n
const value = 0 || 10;<\/code><\/pre>\n\n\n\n
\uc774 \uacbd\uc6b0 0<\/code>\uc740 falsy\uc774\uae30 \ub54c\ubb38\uc5d0 10<\/code>\uc774 \ub41c\ub2e4.<\/p>\n\n\n\n
\ubc18\uba74:<\/p>\n\n\n\n
const value = 0 ?? 10;<\/code><\/pre>\n\n\n\n
\uacb0\uacfc\ub294 0<\/code>\uc774\ub2e4.<\/p>\n\n\n\n
\ub530\ub77c\uc11c “\uac12\uc774 \uc5c6\uc744 \ub54c”\uc640 “falsy\uc77c \ub54c”\ub97c \uad6c\ubd84\ud574\uc57c \ud55c\ub2e4.<\/p>\n\n\n\n
\n\n\n\n
Enum<\/h2>\n\n\n\n
TypeScript\uc5d0\ub294 enum<\/code>\uc774 \uc788\ub2e4.<\/p>\n\n\n\n
enum State {\n    Idle,\n    Move,\n    Attack,\n    Dead\n}<\/code><\/pre>\n\n\n\n
\uc0ac\uc6a9:<\/p>\n\n\n\n
let state: State = State.Attack;<\/code><\/pre>\n\n\n\n
\ub2e4\ub9cc \ud604\ub300 TypeScript \ucf54\ub4dc\uc5d0\uc11c\ub294 \ub2e8\uc21c\ud55c \uc0c1\ud0dc\uac12\uc774\ub77c\uba74 \ubb38\uc790\uc5f4 Literal Union\uc744 \uc0ac\uc6a9\ud558\ub294 \uacbd\uc6b0\ub3c4 \ub9ce\ub2e4.<\/p>\n\n\n\n
type State =\n    | \"idle\"\n    | \"move\"\n    | \"attack\"\n    | \"dead\";<\/code><\/pre>\n\n\n\n
\ud2b9\ud788 JSON\uc774\ub098 API\uc640 \uc9c1\uc811 \uc5f0\uacb0\ub418\ub294 \uac12\uc774\ub77c\uba74 \ubb38\uc790\uc5f4 Union\uc774 \ub354 \uc790\uc5f0\uc2a4\ub7ec\uc6b4 \uacbd\uc6b0\uac00 \ub9ce\ub2e4.<\/p>\n\n\n\n
\n\n\n\n
Literal Type<\/h2>\n\n\n\n
TypeScript\ub294 \ubb38\uc790\uc5f4\uc774\ub098 \uc22b\uc790 \uc790\uccb4\ub97c \ud0c0\uc785\uc73c\ub85c \uc0ac\uc6a9\ud560 \uc218 \uc788\ub2e4.<\/p>\n\n\n\n
let state: \"idle\" | \"attack\";\n\nstate = \"idle\";\nstate = \"attack\";\n\n\/\/ state = \"dead\";<\/code><\/pre>\n\n\n\n
\uc774\uac83\uc740 \ub2e8\uc21c\ud55c string<\/code>\ubcf4\ub2e4 \ud6e8\uc52c \uac15\ud55c \uc81c\uc57d\uc774\ub2e4.<\/p>\n\n\n\n
string -> \ubaa8\ub4e0 \ubb38\uc790\uc5f4\n\"idle\" | \"attack\" -> \ub450 \uac12\ub9cc \ud5c8\uc6a9<\/code><\/pre>\n\n\n\n
UI \uc0c1\ud0dc, \uac8c\uc784 \uc0c1\ud0dc, HTTP Method \uac19\uc740 \uc81c\ud55c\ub41c \uac12 \ud45c\ud604\uc5d0 \uc720\uc6a9\ud558\ub2e4.<\/p>\n\n\n\n
\n\n\n\n
Type Assertion<\/h2>\n\n\n\n
\uac1c\ubc1c\uc790\uac00 \ud2b9\uc815 \ud0c0\uc785\uc774\ub77c\uace0 \ud655\uc2e0\ud558\ub294 \uacbd\uc6b0 Type Assertion\uc744 \uc0ac\uc6a9\ud560 \uc218 \uc788\ub2e4.<\/p>\n\n\n\n
const element =\n    document.getElementById(\"game\")\n    as HTMLCanvasElement;<\/code><\/pre>\n\n\n\n
\uc774\uac83\uc740 \uac12\uc744 \uc2e4\uc81c\ub85c \ubcc0\ud658\ud558\ub294 \uac83\uc774 \uc544\ub2c8\ub2e4.<\/p>\n\n\n\n
Type Assertion -> \"\uc774 \uac12\uc744 \uc774 \ud0c0\uc785\uc73c\ub85c \ucde8\uae09\ud574\ub3c4 \ub41c\ub2e4\"<\/code><\/pre>\n\n\n\n
\ub7f0\ud0c0\uc784\uc5d0\uc11c \uac1d\uccb4 \uc790\uccb4\uac00 \ubcc0\ud658\ub418\ub294 \uac83\uc740 \uc544\ub2c8\ub2e4.<\/p>\n\n\n\n
\ub530\ub77c\uc11c \uc798\ubabb\ub41c Assertion\uc744 \uc0ac\uc6a9\ud558\uba74 \ucef4\ud30c\uc77c\ub7ec\ub97c \uc18d\uc774\ub294 \uacb0\uacfc\uac00 \ub420 \uc218 \uc788\ub2e4.<\/p>\n\n\n\n
\n\n\n\n
Type Guard<\/h2>\n\n\n\n
\ubcf5\uc7a1\ud55c \uac1d\uccb4\uc758 \ud0c0\uc785\uc744 \ub7f0\ud0c0\uc784\uc5d0\uc11c \uac80\uc0ac\ud574\uc57c \ud558\ub294 \uacbd\uc6b0 Type Guard\ub97c \ub9cc\ub4e4 \uc218 \uc788\ub2e4.<\/p>\n\n\n\n
interface Player {\n    name: string;\n}\n\nfunction isPlayer(\n    value: unknown\n): value is Player {\n    return (\n        typeof value === \"object\" &&\n        value !== null &&\n        \"name\" in value\n    );\n}<\/code><\/pre>\n\n\n\n
\uc774\ud6c4:<\/p>\n\n\n\n
if (isPlayer(value)) {\n    console.log(value.name);\n}<\/code><\/pre>\n\n\n\n
value is Player<\/code>\ub77c\ub294 \ubc18\ud658 \ud0c0\uc785\uc744 \ud1b5\ud574 TypeScript\uc5d0\uac8c \ud0c0\uc785\uc744 \uc54c\ub824\uc900\ub2e4.<\/p>\n\n\n\n
API \uc751\ub2f5\uc774\ub098 \uc678\ubd80 \ub370\uc774\ud130\ucc98\ub7fc \ucef4\ud30c\uc77c\ub7ec\uac00 \ud0c0\uc785\uc744 \uc2e0\ub8b0\ud560 \uc218 \uc5c6\ub294 \uacbd\uacc4<\/strong>\uc5d0\uc11c \uc720\uc6a9\ud558\ub2e4.<\/p>\n\n\n\n
\n\n\n\n
Structural Typing<\/h2>\n\n\n\n
TypeScript\uc758 \ud0c0\uc785 \uc2dc\uc2a4\ud15c\uc5d0\uc11c \uc911\uc694\ud55c \uac1c\ub150\uc774\ub2e4.<\/p>\n\n\n\n
TypeScript\ub294 \uae30\ubcf8\uc801\uc73c\ub85c \uac1d\uccb4\uc758 \uc774\ub984\uc774\ub098 \uc0c1\uc18d \uad00\uacc4\ubcf4\ub2e4 \uad6c\uc870\uac00 \ub9de\ub294\uc9c0<\/strong>\ub97c \uae30\uc900\uc73c\ub85c \ud0c0\uc785\uc744 \ud310\ub2e8\ud55c\ub2e4.<\/p>\n\n\n\n
interface Player {\n    name: string;\n}\n\nconst character = {\n    name: \"Knight\",\n    health: 100\n};\n\nconst player: Player = character;<\/code><\/pre>\n\n\n\n
character<\/code>\ub294 Player<\/code>\ub77c\uace0 \uc120\uc5b8\ud558\uc9c0 \uc54a\uc558\uc9c0\ub9cc name: string<\/code>\uc744 \uac00\uc9c0\uace0 \uc788\uae30 \ub54c\ubb38\uc5d0 Player<\/code>\ub85c \uc0ac\uc6a9\ud560 \uc218 \uc788\ub2e4.<\/p>\n\n\n\n
Player -> name: string\nCharacter -> name: string \/ health: number<\/code><\/pre>\n\n\n\n
Character<\/code>\uc758 \uad6c\uc870\uac00 Player<\/code>\uac00 \uc694\uad6c\ud558\ub294 \uad6c\uc870\ub97c \ud3ec\ud568\ud558\uace0 \uc788\uae30 \ub54c\ubb38\uc5d0 \ud638\ud658\ub41c\ub2e4.<\/p>\n\n\n\n
\uc774\uac83\uc774 TypeScript\uc758 Structural Type System<\/strong>\uc774\ub2e4.<\/p>\n\n\n\n
\n\n\n\n
Module<\/h2>\n\n\n\n
TypeScript \ud504\ub85c\uc81d\ud2b8\uc5d0\uc11c\ub294 ES Module\uc744 \uae30\ubcf8\uc801\uc778 \ucf54\ub4dc \ubd84\ub9ac \ubc29\uc2dd\uc73c\ub85c \uc0ac\uc6a9\ud55c\ub2e4.<\/p>\n\n\n\n
\/\/ player.ts\n\nexport class Player {\n}<\/code><\/pre>\n\n\n\n
\ub2e4\ub978 \ud30c\uc77c\uc5d0\uc11c:<\/p>\n\n\n\n
import { Player } from \".\/player\";<\/code><\/pre>\n\n\n\n
\ud568\uc218\ub3c4 export\ud560 \uc218 \uc788\ub2e4.<\/p>\n\n\n\n
export function add(\n    a: number,\n    b: number\n): number {\n    return a + b;\n}<\/code><\/pre>\n\n\n\n
\uc774\ub807\uac8c \ubaa8\ub4c8 \ub2e8\uc704\ub85c \ucf54\ub4dc\ub97c \ubd84\ub9ac\ud558\uba74 \ud504\ub85c\uc81d\ud2b8 \uaddc\ubaa8\uac00 \ucee4\uc838\ub3c4 \uc758\uc874\uc131\uc744 \uad00\ub9ac\ud558\uae30 \uc27d\ub2e4.<\/p>\n\n\n\n
\n\n\n\n
Promise<\/h2>\n\n\n\n
JavaScript\uc758 \ube44\ub3d9\uae30 \ucc98\ub9ac\ub294 TypeScript\uc5d0\uc11c\ub3c4 Promise\ub97c \uc0ac\uc6a9\ud55c\ub2e4.<\/p>\n\n\n\n
function loadPlayer(): Promise<Player> {\n    return fetchPlayer();\n}<\/code><\/pre>\n\n\n\n
async<\/code>\uc640 await<\/code>\ub97c \uc0ac\uc6a9\ud560 \uc218\ub3c4 \uc788\ub2e4.<\/p>\n\n\n\n
async function load() {\n    const player = await loadPlayer();\n\n    console.log(player.name);\n}<\/code><\/pre>\n\n\n\n
\ubc18\ud658 \ud0c0\uc785\ub3c4 \ucd94\ub860\ud560 \uc218 \uc788\uc9c0\ub9cc \ud544\uc694\ud558\uba74 \uba85\uc2dc\ud560 \uc218 \uc788\ub2e4.<\/p>\n\n\n\n
async function load(): Promise<Player> {\n    return await loadPlayer();\n}<\/code><\/pre>\n\n\n\n
TypeScript\ub294 \uc5ec\uae30\uc11c \ube44\ub3d9\uae30 \uc2e4\ud589 \uc790\uccb4\ub97c \uc81c\uacf5\ud558\ub294 \uac83\uc774 \uc544\ub2c8\ub2e4. JavaScript\uc758 Promise\uc640 async\/await\uc5d0 \ud0c0\uc785 \uc815\ubcf4\ub97c \ucd94\uac00\ud558\ub294 \uc5ed\ud560<\/strong>\uc744 \ud55c\ub2e4.<\/p>\n\n\n\n
\n\n\n\n
API\uc640 TypeScript<\/h2>\n\n\n\n
TypeScript\uac00 \uc2e4\ubb34\uc5d0\uc11c \ud2b9\ud788 \uc720\uc6a9\ud55c \ubd80\ubd84 \uc911 \ud558\ub098\uac00 API \ub370\uc774\ud130 \uad6c\uc870\ub97c \uba85\ud655\ud558\uac8c \ud45c\ud604\ud560 \uc218 \uc788\ub2e4\ub294 \uc810\uc774\ub2e4.<\/p>\n\n\n\n
interface PlayerResponse {\n    id: number;\n    name: string;\n    level: number;\n}<\/code><\/pre>\n\n\n\n
API \ud638\ucd9c:<\/p>\n\n\n\n
async function getPlayer(): Promise<PlayerResponse> {\n    const response = await fetch(\"\/api\/player\");\n\n    return response.json();\n}<\/code><\/pre>\n\n\n\n
\uc774\uc81c \ucf54\ub4dc\ub97c \uc791\uc131\ud560 \ub54c \uc751\ub2f5 \ub370\uc774\ud130\uc758 \uad6c\uc870\ub97c \uae30\uc900\uc73c\ub85c \uc790\ub3d9 \uc644\uc131\uacfc \ud0c0\uc785 \uac80\uc0ac\ub97c \ubc1b\uc744 \uc218 \uc788\ub2e4.<\/p>\n\n\n\n
\ub2e4\ub9cc \uc5ec\uae30\uc11c \uc8fc\uc758\ud560 \uc810\uc774 \uc788\ub2e4.<\/p>\n\n\n\n
const data: PlayerResponse =\n    await response.json();<\/code><\/pre>\n\n\n\n
\uc774\ub807\uac8c \ud0c0\uc785\uc744 \uc9c0\uc815\ud588\ub2e4\uace0 \ud574\uc11c \uc11c\ubc84\uc5d0\uc11c \uc2e4\uc81c\ub85c PlayerResponse<\/code> \ud615\ud0dc\uc758 \ub370\uc774\ud130\uac00 \uc654\ub2e4\ub294 \uac83\uc774 \uac80\uc99d\ub418\ub294 \uac83\uc740 \uc544\ub2c8\ub2e4.<\/p>\n\n\n\n
TypeScript\uc758 \ud0c0\uc785\uc740 \ub7f0\ud0c0\uc784 \ub370\uc774\ud130\ub97c \uc790\ub3d9\uc73c\ub85c \uac80\uc99d\ud558\uc9c0 \uc54a\ub294\ub2e4.<\/p>\n\n\n\n
\uc678\ubd80 \ub370\uc774\ud130\uac00 \uc2e0\ub8b0\ud560 \uc218 \uc5c6\ub294 \uacbd\uc6b0\uc5d0\ub294 \ubcc4\ub3c4\uc758 \ub7f0\ud0c0\uc784 \uac80\uc99d\uc774 \ud544\uc694\ud558\ub2e4.<\/p>\n\n\n\n
\n\n\n\n
TypeScript\uc758 \ucef4\ud30c\uc77c \uacfc\uc815<\/h2>\n\n\n\n
TypeScript \ud504\ub85c\uc81d\ud2b8\ub294 \ub300\ub7b5 \ub2e4\uc74c\uacfc \uac19\uc740 \uacfc\uc815\uc744 \uac70\uce5c\ub2e4.<\/p>\n\n\n\n
.ts \/ .tsx -> TypeScript Compiler -> Type Checking -> JavaScript -> Bundler -> Browser \/ Node.js<\/code><\/pre>\n\n\n\n
\ub300\ud45c\uc801\uc778 \uc124\uc815 \ud30c\uc77c\uc774 tsconfig.json<\/code>\uc774\ub2e4.<\/p>\n\n\n\n
{\n    \"compilerOptions\": {\n        \"target\": \"ES2022\",\n        \"module\": \"ESNext\",\n        \"strict\": true\n    }\n}<\/code><\/pre>\n\n\n\n
\uc5ec\uae30\uc5d0\uc11c strict<\/code> \uac19\uc740 \uc635\uc158\uc744 \ud1b5\ud574 \ud0c0\uc785 \uac80\uc0ac\uc758 \uc5c4\uaca9\ub3c4\ub97c \uc870\uc808\ud560 \uc218 \uc788\ub2e4.<\/p>\n\n\n\n
\uc2e4\uc81c \ud504\ub85c\uc81d\ud2b8\uc5d0\uc11c\ub294 TypeScript \ucef4\ud30c\uc77c\ub7ec\uac00 JavaScript\ub97c \ub9cc\ub4e4\uace0, Vite, Webpack, esbuild, SWC \uac19\uc740 \ub3c4\uad6c\uac00 \ubc88\ub4e4\ub9c1\uc774\ub098 \ubcc0\ud658\uc744 \ub2f4\ub2f9\ud558\ub294 \uad6c\uc870\ub3c4 \ud754\ud558\ub2e4.<\/p>\n\n\n\n
\n\n\n\n
TypeScript\uc640 Node.js<\/h2>\n\n\n\n
TypeScript \uc790\uccb4\uac00 \uc11c\ubc84 \ub7f0\ud0c0\uc784\uc740 \uc544\ub2c8\ub2e4.<\/p>\n\n\n\n
Node.js\uc5d0\uc11c TypeScript\ub97c \uc0ac\uc6a9\ud558\uba74 \uc77c\ubc18\uc801\uc73c\ub85c \ub2e4\uc74c \uad6c\uc870\uac00 \ub41c\ub2e4.<\/p>\n\n\n\n
TypeScript -> Compile \/ Transform -> JavaScript -> Node.js<\/code><\/pre>\n\n\n\n
\uc608\ub97c \ub4e4\uc5b4 Express\ub97c \uc0ac\uc6a9\ud55c\ub2e4\uba74:<\/p>\n\n\n\n
Client -> HTTP -> Node.js -> Express -> TypeScript Business Logic -> Database<\/code><\/pre>\n\n\n\n
TypeScript\ub294 \uc5ec\uae30\uc11c \uc11c\ubc84\uc758 \ube44\uc988\ub2c8\uc2a4 \ub85c\uc9c1\uacfc \ub370\uc774\ud130 \uad6c\uc870\uc5d0 \ud0c0\uc785\uc744 \ubd80\uc5ec\ud55c\ub2e4.<\/p>\n\n\n\n
\n\n\n\n
TypeScript\uc640 React<\/h2>\n\n\n\n
React\uc5d0\uc11c\ub3c4 TypeScript\ub97c \uc0ac\uc6a9\ud560 \uc218 \uc788\ub2e4.<\/p>\n\n\n\n
interface Props {\n    name: string;\n    level: number;\n}\n\nfunction PlayerInfo({\n    name,\n    level\n}: Props) {\n    return (\n        <div>\n            {name} - {level}\n        <\/div>\n    );\n}<\/code><\/pre>\n\n\n\n
\ucef4\ud3ec\ub10c\ud2b8\uc758 Props \uad6c\uc870\uac00 \uba85\ud655\ud574\uc9c4\ub2e4.<\/p>\n\n\n\n
Parent Component -> Props -> TypeScript Type Check -> Child Component<\/code><\/pre>\n\n\n\n
\ub300\uaddc\ubaa8 \ud504\ub860\ud2b8\uc5d4\ub4dc \ud504\ub85c\uc81d\ud2b8\uc5d0\uc11c \ucef4\ud3ec\ub10c\ud2b8 \uac04 \ub370\uc774\ud130 \uad6c\uc870\ub97c \uba85\ud655\ud558\uac8c \uc720\uc9c0\ud558\ub294 \ub370 \uc0c1\ub2f9\ud788 \uc720\uc6a9\ud558\ub2e4.<\/p>\n\n\n\n
\n\n\n\n
TypeScript\uc758 \uc7a5\uc810<\/h2>\n\n\n\n
TypeScript\uc758 \uac00\uc7a5 \ud070 \uc7a5\uc810\uc740 JavaScript\uc758 \uc720\uc5f0\uc131\uc744 \uc720\uc9c0\ud558\uba74\uc11c \uc815\uc801 \ud0c0\uc785 \uac80\uc0ac\ub97c \ucd94\uac00\ud560 \uc218 \uc788\ub2e4\ub294 \uac83<\/strong>\uc774\ub2e4.<\/p>\n\n\n\n
\ud2b9\ud788 \uaddc\ubaa8\uac00 \ucee4\uc9c0\uba74 \ud6a8\uacfc\uac00 \ud06c\ub2e4.<\/p>\n\n\n\n
\ud568\uc218 -> Parameter Type \/ Return Type\n\uac1d\uccb4 -> Property Type\nAPI -> Request \/ Response Type\nComponent -> Props Type<\/code><\/pre>\n\n\n\n
\uc774\ub7f0 \uad6c\uc870\uac00 \ucf54\ub4dc\uc5d0 \ub0a8\uae30 \ub54c\ubb38\uc5d0 IDE\uc758 \uc790\ub3d9 \uc644\uc131, \ub9ac\ud329\ud130\ub9c1, \uc624\ub958 \ud0d0\uc9c0\uac00 \ud6e8\uc52c \uc88b\uc544\uc9c4\ub2e4.<\/p>\n\n\n\n
\ud2b9\ud788 \uc5ec\ub7ec \uac1c\ubc1c\uc790\uac00 \ud558\ub098\uc758 \ucf54\ub4dc\ubca0\uc774\uc2a4\ub97c \uc218\uc815\ud558\uac70\ub098 \uc7a5\uae30\uac04 \uc720\uc9c0\ubcf4\uc218\ud574\uc57c \ud558\ub294 \ud504\ub85c\uc81d\ud2b8\uc5d0\uc11c \ud0c0\uc785 \uc815\ubcf4 \uc790\uccb4\uac00 \uc77c\uc885\uc758 \ubb38\uc11c \uc5ed\ud560\uc744 \ud55c\ub2e4.<\/p>\n\n\n\n
\n\n\n\n
TypeScript\uc758 \ud55c\uacc4<\/h2>\n\n\n\n
TypeScript\uac00 \ubaa8\ub4e0 \ud0c0\uc785 \ubb38\uc81c\ub97c \ud574\uacb0\ud574\uc8fc\ub294 \uac83\uc740 \uc544\ub2c8\ub2e4.<\/p>\n\n\n\n
\uac00\uc7a5 \ud070 \uc624\ud574\uac00 \uc774\uac83\uc774\ub2e4.<\/p>\n\n\n\n
TypeScript != Runtime Type Safety<\/code><\/pre>\n\n\n\n
\uc608\ub97c \ub4e4\uc5b4:<\/p>\n\n\n\n
interface Player {\n    name: string;\n}\n\nconst player =\n    JSON.parse(input) as Player;<\/code><\/pre>\n\n\n\n
\uc774 \ucf54\ub4dc\uc5d0\uc11c input<\/code>\uc774 \uc2e4\uc81c\ub85c Player<\/code> \ud615\ud0dc\uc778\uc9c0 TypeScript\uac00 \uac80\uc0ac\ud558\uc9c0 \uc54a\ub294\ub2e4.<\/p>\n\n\n\n
as Player<\/code>\ub294 \ub2e8\uc9c0 \ucef4\ud30c\uc77c\ub7ec\uc5d0\uac8c \uadf8\ub807\uac8c \ucde8\uae09\ud558\ub77c\uace0 \ub9d0\ud558\ub294 \uac83\uc774\ub2e4.<\/p>\n\n\n\n
\ub530\ub77c\uc11c \ub2e4\uc74c\uacfc \uac19\uc740 \uc678\ubd80 \ub370\uc774\ud130\ub294 \ubcc4\ub3c4\ub85c \uac80\uc99d\ud574\uc57c \ud55c\ub2e4.<\/p>\n\n\n\n
HTTP Response \/ Database \/ User Input \/ File \/ WebSocket \/ External API<\/code><\/pre>\n\n\n\n
TypeScript\uc758 \ud0c0\uc785 \uc2dc\uc2a4\ud15c\uacfc \ub7f0\ud0c0\uc784 \uac80\uc99d\uc740 \ubcc4\uac1c\uc758 \ubb38\uc81c\ub2e4.<\/p>\n\n\n\n
\n\n\n\n
JavaScript\uc640 TypeScript\uc758 \uad00\uacc4<\/h2>\n\n\n\n
\ub458\uc758 \uad00\uacc4\ub97c \ud558\ub098\uc758 \ud750\ub984\uc73c\ub85c \uc815\ub9ac\ud558\uba74 \ub2e4\uc74c\uacfc \uac19\ub2e4.<\/p>\n\n\n\n
JavaScript -> Dynamic Type -> Runtime\uc5d0\uc11c \ud0c0\uc785 \uacb0\uc815\nTypeScript -> JavaScript + Static Type System -> Compile Time Type Check -> JavaScript -> Runtime<\/code><\/pre>\n\n\n\n
TypeScript\ub294 JavaScript\ub97c \ubc84\ub9ac\uace0 \uc0c8\ub85c\uc6b4 \uc2e4\ud589 \ud658\uacbd\uc744 \ub9cc\ub4dc\ub294 \ubc29\ud5a5\uc774 \uc544\ub2c8\ub2e4.<\/p>\n\n\n\n
\uae30\uc874 JavaScript \uc0dd\ud0dc\uacc4\ub97c \uc720\uc9c0\ud558\uba74\uc11c \uac1c\ubc1c \ub2e8\uacc4\uc5d0\uc11c \ub354 \ub9ce\uc740 \uc815\ubcf4\ub97c \ud655\ubcf4\ud558\ub294 \ubc29\ud5a5<\/strong>\uc774\ub2e4.<\/p>\n\n\n\n
\uadf8\ub798\uc11c \uae30\uc874 JavaScript \ub77c\uc774\ube0c\ub7ec\ub9ac\ub3c4 TypeScript\uc5d0\uc11c \uc0ac\uc6a9\ud560 \uc218 \uc788\uace0, Node.js, React, Next.js \uac19\uc740 JavaScript \uc0dd\ud0dc\uacc4\uc758 \ub3c4\uad6c\ub4e4\uacfc \ud568\uaed8 \uc0ac\uc6a9\ud560 \uc218 \uc788\ub2e4.<\/p>\n\n\n\n
\n\n\n\n
TypeScript\uc758 \ud575\uc2ec \uad6c\uc870<\/h2>\n\n\n\n
TypeScript\ub97c \uc804\uccb4\uc801\uc73c\ub85c \ubcf4\uba74 \ub2e4\uc74c\uacfc \uac19\uc774 \uc815\ub9ac\ud560 \uc218 \uc788\ub2e4.<\/p>\n\n\n\n
JavaScript -> Type System -> Type Inference -> Interface \/ Type -> Union \/ Intersection -> Generic -> Narrowing -> Structural Typing -> Class \/ Module -> Promise \/ Async -> TypeScript Compiler -> JavaScript -> Runtime<\/code><\/pre>\n\n\n\n
\uc5ec\uae30\uc11c \uac00\uc7a5 \uc911\uc694\ud55c \uad00\uacc4\ub294 TypeScript\uc758 \ud0c0\uc785 \uc815\ubcf4\uac00 \uc2e4\ud589\uc744 \uc704\ud55c \uc815\ubcf4\uac00 \uc544\ub2c8\ub77c \uac1c\ubc1c\uacfc \ucef4\ud30c\uc77c\uc744 \uc704\ud55c \uc815\ubcf4\ub77c\ub294 \uac83<\/strong>\uc774\ub2e4.<\/p>\n\n\n\n
TypeScript Type -> \uac1c\ubc1c \ub2e8\uacc4 -> \uac80\uc0ac \/ \uc790\ub3d9 \uc644\uc131 \/ \ub9ac\ud329\ud130\ub9c1 -> JavaScript -> Runtime<\/code><\/pre>\n\n\n\n
\n\n\n\n
\uc815\ub9ac<\/h2>\n\n\n\n
TypeScript\ub294 \ub2e8\uc21c\ud788 JavaScript\uc5d0 : number<\/code>, : string<\/code>\uc744 \ubd99\uc774\ub294 \uc5b8\uc5b4\ub294 \uc544\ub2c8\ub2e4.<\/p>\n\n\n\n
\ud575\uc2ec\uc740 JavaScript\uac00 \uac00\uc9c4 \ub3d9\uc801\uc774\uace0 \uc720\uc5f0\ud55c \uad6c\uc870 \uc704\uc5d0 \uc815\uc801 \ud0c0\uc785 \uc2dc\uc2a4\ud15c\uc744 \ucd94\uac00\ud574\uc11c \ud504\ub85c\uadf8\ub7a8\uc758 \uad6c\uc870\ub97c \ucf54\ub4dc \uc218\uc900\uc5d0\uc11c \uba85\ud655\ud558\uac8c \ud45c\ud604\ud558\ub294 \uac83<\/strong>\uc774\ub2e4.<\/p>\n\n\n\n
\ud2b9\ud788 \ub2e4\uc74c \uac1c\ub150\ub4e4\uc774 \uc11c\ub85c \uc5f0\uacb0\ub418\uc5b4 \uc788\ub2e4.<\/p>\n\n\n\n
Type Annotation -> Type Inference -> Union \/ Intersection -> Narrowing -> Generic -> Interface \/ Type -> Structural Typing<\/code><\/pre>\n\n\n\n
\uadf8\ub9ac\uace0 \uc2e4\uc81c \uc560\ud50c\ub9ac\ucf00\uc774\uc158\uc5d0\uc11c\ub294 \uc774 \ud0c0\uc785 \uc2dc\uc2a4\ud15c\uc774 \ud568\uc218, \uac1d\uccb4, API, \ucef4\ud3ec\ub10c\ud2b8, \ub370\uc774\ud130\ubca0\uc774\uc2a4 \ubaa8\ub378 \ub4f1\uc758 \uacbd\uacc4\ub97c \uc815\uc758\ud558\ub294 \ub370 \uc0ac\uc6a9\ub41c\ub2e4.<\/p>\n\n\n\n
\ub2e4\ub9cc TypeScript\ub294 \ub7f0\ud0c0\uc784\uc744 \ud1b5\uc81c\ud558\uc9c0 \uc54a\ub294\ub2e4.<\/p>\n\n\n\n
TypeScript -> \"\uc774 \ucf54\ub4dc\uc758 \ud0c0\uc785 \uad6c\uc870\uac00 \uc62c\ubc14\ub978\uac00?\"\nRuntime Validation -> \"\uc2e4\uc81c\ub85c \ub4e4\uc5b4\uc628 \ub370\uc774\ud130\uac00 \uc62c\ubc14\ub978\uac00?\"<\/code><\/pre>\n\n\n\n
\ub97c \uac80\uc0ac\ud558\ub294 \uac83\uc740 \ubcc4\ub3c4\uc758 \ubb38\uc81c\ub2e4.<\/p>\n\n\n\n
\uc774 \ucc28\uc774\ub97c \uc54c\uace0 \uc788\uc5b4\uc57c TypeScript\ub97c \uc81c\ub300\ub85c \uc0ac\uc6a9\ud560 \uc218 \uc788\ub2e4.<\/p>\n\n\n\n
\uacb0\uad6d TypeScript\ub294 JavaScript \uc0dd\ud0dc\uacc4\ub97c \uc720\uc9c0\ud558\uba74\uc11c \ucf54\ub4dc\uc758 \uad6c\uc870\uc640 \uacc4\uc57d\uc744 \ud0c0\uc785 \uc2dc\uc2a4\ud15c\uc73c\ub85c \uba85\uc2dc\ud558\uace0, \ucef4\ud30c\uc77c \ub2e8\uacc4\uc5d0\uc11c \ub9ce\uc740 \uc624\ub958\ub97c \uc81c\uac70\ud558\ub294 \uc5b8\uc5b4<\/strong>\ub77c\uace0 \ubcfc \uc218 \uc788\ub2e4.<\/p>\n\n\n\n
\ud504\ub860\ud2b8\uc5d4\ub4dc\uc5d0\uc11c\ub294 React, Next.js \uac19\uc740 \uc0dd\ud0dc\uacc4\uc640 \ud568\uaed8 \uc0ac\uc6a9\ub418\uace0, \ubc31\uc5d4\ub4dc\uc5d0\uc11c\ub294 Node.js\uc640 \uacb0\ud569\ud560 \uc218 \uc788\ub2e4. \uaddc\ubaa8\uac00 \ucee4\uc9c8\uc218\ub85d \ud0c0\uc785 \uc815\ubcf4\uac00 \ucf54\ub4dc\uc758 \uad6c\uc870\ub97c \uc124\uba85\ud558\ub294 \uc5ed\ud560\uae4c\uc9c0 \ud558\uac8c \ub41c\ub2e4\ub294 \uc810\uc774 TypeScript\ub97c \uc0ac\uc6a9\ud558\ub294 \uac00\uc7a5 \ud604\uc2e4\uc801\uc778 \uc774\uc720\ub77c\uace0 \ubcfc \uc218 \uc788\ub2e4.<\/p>\n","protected":false},"excerpt":{"rendered":"
TypeScript\ub294 JavaScript\uc5d0 \uc815\uc801 \ud0c0\uc785 \uc2dc\uc2a4\ud15c\uc744 \ucd94\uac00\ud55c \ud504\ub85c\uadf8\ub798\ubc0d \uc5b8\uc5b4\ub2e4. Microsoft\uc5d0\uc11c \uac1c\ubc1c\ud588\uc73c\uba70, JavaScript \uc0dd\ud0dc\uacc4\ub97c \uadf8\ub300\ub85c \uc0ac\uc6a9\ud558\uba74\uc11c \uaddc\ubaa8\uac00 \ucee4\uc84c\uc744 \ub54c \ubc1c\uc0dd\ud558\ub294 \ud0c0\uc785 \uad00\ub828 \ubb38\uc81c\ub97c \uc904\uc774\ub294 \uac83\uc744 \uc8fc\uc694 \ubaa9\uc801\uc73c\ub85c \ud55c\ub2e4. TypeScript\uc758 \uac00\uc7a5 \uc911\uc694\ud55c \ud2b9\uc9d5\uc740 \ube0c\ub77c\uc6b0\uc800\ub098 Node.js\uac00 TypeScript\ub97c \uc9c1\uc811 \uc2e4\ud589\ud558\ub294 \uac83\uc774 \uc544\ub2c8\ub77c\ub294 \uc810\uc774\ub2e4. \uc791\uc131\ud55c TypeScript \ucf54\ub4dc\ub294 \uba3c\uc800 JavaScript\ub85c \ubcc0\ud658\ub41c\ub2e4. \ub530\ub77c\uc11c TypeScript\ub294 JavaScript\ub97c \ub300\uccb4\ud558\ub294 \ubcc4\ub3c4\uc758 \uc2e4\ud589 \ud658\uacbd\uc774\ub77c\uae30\ubcf4\ub2e4 JavaScript \ud504\ub85c\uadf8\ub7a8\uc744 \ub354 \uc548\uc804\ud558\uac8c […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[50],"tags":[],"class_list":["post-1703","post","type-post","status-publish","format-standard","hentry","category-language"],"_links":{"self":[{"href":"https:\/\/wayhope.kro.kr\/index.php?rest_route=\/wp\/v2\/posts\/1703","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wayhope.kro.kr\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/wayhope.kro.kr\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/wayhope.kro.kr\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/wayhope.kro.kr\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=1703"}],"version-history":[{"count":3,"href":"https:\/\/wayhope.kro.kr\/index.php?rest_route=\/wp\/v2\/posts\/1703\/revisions"}],"predecessor-version":[{"id":1986,"href":"https:\/\/wayhope.kro.kr\/index.php?rest_route=\/wp\/v2\/posts\/1703\/revisions\/1986"}],"wp:attachment":[{"href":"https:\/\/wayhope.kro.kr\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=1703"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/wayhope.kro.kr\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=1703"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/wayhope.kro.kr\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=1703"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}