Notice
Recent Posts
Recent Comments
Link
250x250
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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 |
Tags
- 내일배움캠프 최종 프로젝트
- 파이썬 반복문
- 리액트 프로젝트
- 파이썬 slice
- useState
- 타입스크립트
- 리액트
- 파이썬 enumerate
- 한글 공부 사이트
- useEffect
- Next 팀 프로젝트
- 내배캠 프로젝트
- React Hooks
- 타입스크립트 리액트
- 파이썬 딕셔너리
- 코딩테스트
- JavaScript
- tanstack query
- 리액트 훅
- 내일배움캠프 프로젝트
- 파이썬 for in
- 파이썬 for
- 프로그래머스
- 내일배움캠프
- 타입스크립트 props
- REACT
- typeScript
- 리액트 공식문서
- 자바스크립트
- 파이썬 replace
Archives
- Today
- Total
sohyeon kim
[TS] 타입스크립트 활용 : 간단한 카페 주문 받기 프로그램 본문
728x90
💡 간단한 카페 주문 프로그램을 만들어보자.
src/index.ts
먼저 타입 정의
interface User {
id: number;
name: string;
role: 'admin' | 'customer';
}
interface Beverage {
name: string;
price: number;
}
interface Order {
orderId: number;
customerId: number;
customerName: string;
beverageName: string;
status: 'placed' | 'completed' | 'picked-up';
}
let beverages: Beverage[] = [];
let orders: Order[] = [];
먼저 쓸 타입들을 정의해둔다.
User 유효성 검사
function isAdmin(user: User): boolean {
return user.role === 'admin';
}
function isCustomer(user: User): boolean {
return user.role === 'customer';
}
그리고 주문은 고객만이, 조제는 직원만이 할 수 있으므로
user 가 고객인지, 직원인지를 확인하는 검사 함수를 만든다.
const user1: User = {
id: 1,
name: 'aoto',
role: 'admin',
};
const user2: User = {
id: 2,
name: 'yae',
role: 'customer',
};
isAdmin(user1);
isCustomer(user2);
확인하려고 써본 코드 ㅎㅎ 안써도 된다.
직원이 메뉴에 음료 추가, 삭제
function addBeverage(user: User, name: string, price: number): void {
if (!isAdmin(user)) {
console.log('권한이 없습니다.');
return;
}
const newBerverage: Beverage = { name, price };
beverages.push(newBerverage); // 받은 이름과 가격으로 객체를 만들어 배열에 넣는다.
}
function removeBeverage(user: User, beverageName: string): void {
if (!isAdmin(user)) {
console.log('권한이 없습니다.');
return;
}
beverages = beverages.filter((beverage) => beverage.name !== beverageName);
// 받은 이름으로 배열에서 걸러낸다.
}
음료를 더하고 삭제할 수 있는 함수!
직원만이 할 수 있으니 유효성 검사를 넣어준다.
음료 가져오기 (검색?)
function getBeverages(user: User): Beverage[] {
if (!user) return [];
return beverages;
}
무슨 음료가 있는지 확인하는 함수 ~ 유저만이 확인 가능
고객이 음료 주문
function findBeverage(beverageName: string): Beverage | undefined {
return beverages.find((beverage) => beverage.name === beverageName);
}
function placeOrder(user: User, beverageName: string): number {
if (!isCustomer(user)) {
console.log('권한이 없습니다.');
return -1;
}
const beverage = findBeverage(beverageName); // 주문 받은 음료가 카페에서 파는 음료인지 확인
if (!beverage) {
console.log('해당 음료를 찾을 수 없습니다.');
return -1;
}
const newOrder: Order = {
orderId: orders.length + 1,
customerId: user.id,
customerName: user.name,
beverageName,
status: 'placed',
};
orders.push(newOrder); // 오더스 배열에 새 주문 추가
return newOrder.orderId; // 새 오더 아이디 반환
}
고객만이 주문이 가능하므로 유효성 검사를 넣어줬다.
직원이 음료 조제 완료
function completeOrder(user: User, orderId: number): void {
if (!isAdmin(user)) { // 직원만이 가능
console.log('권한이 없습니다.');
return;
}
const order = orders.find((order) => order.orderId === orderId); // 아이디를 찾아
if (order) {
order.status = 'completed'; // 완료 상태로 바꾼다.
console.log(
`[고객 메세지] ${order.customerName}님. 주문하신 ${order.beverageName} 1잔 나왔습니다.`
);
}
}
고객이 음료 픽업
function pickUpOrder(user: User, orderId: number): void {
if (!isCustomer(user)) { // 고객만 가능
console.log('권한이 없습니다.');
return;
}
const order = orders.find(
(order) => order.orderId === orderId && order.customerId === user.id
); // 오더스 중에서 오더아이디가 같고, 고객 아이디와 유저 아이디가 같은 애를 찾아낸다.
if (order && order.status === 'completed') { // 그 오더가 조제 완료 상태면
order.status = 'picked-up'; // 픽업 상태로 바꾼다.
console.log(
`[어드민 메세지] ${order.customerId}님이 주문하신 ${orderId} 를 수령했습니다.`
);
}
}
실행해 보자 ~
function main() {
const admin: User = { // 직원 생성
id: 1,
name: 'aoto',
role: 'admin',
};
const member1: User = { // 고객 생성
id: 2,
name: 'yae',
role: 'customer',
};
const member2: User = { // 고객 생성
id: 3,
name: 'haru',
role: 'customer',
};
// 음료 등록
addBeverage(admin, '아메리카노', 4000);
addBeverage(admin, '카페라떼', 4000);
addBeverage(admin, '핫초코', 4000);
// 음료 삭제
removeBeverage(admin, '카페라떼');
console.log(
`안녕하세요. ${member1.name} 고객님. 환영합니다. 저희는 ${JSON.stringify(getBeverages(member1))} 를 판매하고 있습니다.`
);
// 음료 주문
const orderId1 = placeOrder(member1, '아메리카노');
if (orderId1 > 0) {
setTimeout(() => {
completeOrder(admin, orderId1); // 음료 조제 완료
pickUpOrder(member1, orderId1); // 음료수령
}, 1000);
}
console.log(
`안녕하세요. ${member2.name} 고객님. 환영합니다. 저희는 ${JSON.stringify(getBeverages(member2))} 를 판매하고 있습니다.`
);
// 음료 주문
const orderId2 = placeOrder(member2, '아메리카노');
if (orderId2 > 0) {
setTimeout(() => {
completeOrder(admin, orderId2); // 음료 조제 완료
pickUpOrder(member2, orderId2); // 음료수령
}, 1000);
}
}
main();
🌀 결과 🌀
안녕하세요. yae 고객님. 환영합니다. 저희는 [{"name":"아메리카노","price":4000},{"name":"핫초코","price":4000}] 를 판매하고 있습니다.
안녕하세요. haru 고객님. 환영합니다. 저희는 [{"name":"아메리카노","price":4000},{"name":"핫초코","price":4000}] 를 판매하고 있습니다.
[고객 메세지] yae님. 주문하신 아메리카노 1잔 나왔습니다.
[어드민 메세지] 2님이 주문하신 1 를 수령했습니다.
[고객 메세지] haru님. 주문하신 아메리카노 1잔 나왔습니다.
[어드민 메세지] 3님이 주문하신 2 를 수령했습니다.
728x90
반응형
'TypeScript' 카테고리의 다른 글
[TS] 비동기 함수 & React에 타입스크립트 사용 : props (1) | 2024.03.06 |
---|---|
[TS] 타입스크립트 활용 : 간단한 책 대여 프로그램 class (1) | 2024.03.06 |
[TS] 타입스크립트 모듈 사용, 옵션 설정 & tsconfig/bases (0) | 2024.03.05 |
[TS] Pick, Omit, Exclude : Generic 을 사용한 유틸리티 타입, 객체 프로퍼티 고르기, 생략하기 & Union 제거 (1) | 2024.03.05 |
[TS] generic 제네릭 타입 <string> ~ <number> ~ <???> ~ (0) | 2024.03.05 |