Let’s make a calculator
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
type Command = "add" | "substract" | "multiply" | "divide" | "remainder";
const add = (num1: number, num2: number): number => {
return num1 + num2;
};
const substract = (num1: number, num2: number): number => {
return num1 - num2;
};
const multiply = (num1: number, num2: number): number => {
return num1 * num2;
};
const divide = (num1: number, num2: number): number => {
return num1 / num2;
};
const remainder = (num1: number, num2: number): number => {
return num1 % num2;
};
const calculate = (command: Command, num1: number, num2: number): number => {
switch (command) {
case "add":
return add(num1, num2);
case "substract":
return substract(num1, num2);
case "multiply":
return multiply(num1, num2);
case "divide":
return divide(num1, num2);
case "remainder":
return remainder(num1, num2);
default:
throw new Error(`unknown command ${command}`);
}
};
Let’s make a game
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
const position = { x: 0, y: 0 };
type Direction = "up" | "down" | "left" | "right";
const move = (direction: Direction) => {
switch (direction) {
case "up":
position.y += 1;
case "down":
position.y -= 1;
case "left":
position.x -= 1;
case "right":
position.x += 1;
default:
throw new Error(`unknown direction ${direction}`);
}
};
Print loading state
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
type LoadingState = {
state: "loading"
};
type SuccessState = {
state: "success"
response: {
body: string
}
};
type FailState = {
state: "fail"
reason: string
};
type ResourceLoadState = LoadingState | SuccessState | FailState
const printLogState= (state: ResourceLoadState) => {
switch(state.state){
case "loading":
console.log("loading...")
break;
case "success":
console.log(`loaded. ${state.response.body}`)
break;
case "fail":
console.log(`no network. ${reason}`);
break;
}
}
화살표 함수를 사용한 건 개인의 취향.