728x90
반응형
타입 정의 하기
function completeTodo(index:number, todo:{
id: number,
title: string,
done: boolean,
}): void {
todo.done = true;
todoItems.splice(index, 1, todo);
}
타입 정의
let todoItems: {
id: number,
title: string,
done: boolean
}[];
function completeTodo(index:number, todo:{
id: number,
title: string,
done: boolean,
}): void {
todo.done = true;
todoItems.splice(index, 1, todo);
}
중복되는 코드를 줄이고 타입을 하나로 정의해서 사용하기
// [타입별칭] 타입에 이름을 부여
// type Todo = {
// id: number,
// title: string,
// done: boolean
// }
interface Todo {
id: number,
title: string,
done: boolean
}
let todoItems: Todo[]
// api
function fetchTodoItems(): Todo[] {
const todos:Todo[]
= [
{ id: 1, title: '안녕', done: false },
{ id: 2, title: '타입', done: false },
{ id: 3, title: '스크립트', done: false },
];
return todos;
}
// crud methods
function fetchTodos(): Todo[] {
const todos = fetchTodoItems();
return todos;
}
// void: 반환값이 없음
function addTodo(todo:Todo): void {
todoItems.push(todo);
}
function deleteTodo(index: number):void {
todoItems.splice(index, 1);
}
function completeTodo(index:number, todo:Todo): void {
todo.done = true;
todoItems.splice(index, 1, todo);
}
// business logic
function logFirstTodo(): Todo {
return todoItems[0];
}
function showCompleted(): Todo[] {
return todoItems.filter(item => item.done);
}
// TODO: 아래 함수의 내용을 채워보세요. 아래 함수는 `addTodo()` 함수를 이용하여 2개의 새 할 일을 추가하는 함수입니다.
function addTwoTodoItems():void {
// addTodo() 함수를 두 번 호출하여 todoItems에 새 할 일이 2개 추가되어야 합니다.
for(let i = 0; i < 1; i++){
addTodo({
id: i,
title:'청소하기',
done: false,
})
}
}
// NOTE: 유틸 함수
function log():void {
console.log(todoItems);
}
todoItems = fetchTodoItems();
addTwoTodoItems();
log();
728x90
'programming language > TypeScript' 카테고리의 다른 글
타입 추론과 타입 단언 (1) | 2024.08.15 |
---|---|
제네릭(Generics) 재 정리!! (0) | 2022.12.28 |
제네릭 화살표함수 (0) | 2022.12.22 |
제네릭을 이용한 타입 정의 (0) | 2022.12.15 |
ts에서 class를 사용할 때 (0) | 2022.12.14 |
댓글