Função: Imprimir Resumo das Tarefas
Parte da seção Introdução ao TypeScript do Journey de JavaScript da Coddy. Lição 49 de 73.
Desafio
FácilVocê recebeu o seguinte do desafio anterior:
- A interface
Taskcomid(number),title(string) estatus(tipo literal) - Três variáveis de tarefa:
firstTask,secondTaskethirdTask - A função
getTaskInfo - A função
addTask - A função
changeTaskStatus - A função
listTasksByStatus - Os arrays
initialTasks,updatedTasks,testTasks,progressTasks,completedTasks,mixedTasks,todoTasks,inProgressTasksedoneTasks
Crie uma função chamada printTaskSummary que recebe um parâmetro:
taskdo tipoTask(um único objeto Task)
A função deve:
- Imprimir um resumo formatado no console no formato exato:
"ID: [id], Title: [title], Status: [status]" - Ter um tipo de retorno
void
Crie uma função chamada printAllTaskSummaries que recebe um parâmetro:
taskListdo tipoTask[](um array de objetos Task)
A função deve:
- Usar um loop para chamar
printTaskSummarypara cada tarefa no array - Ter um tipo de retorno
void
Crie uma variável chamada sampleTasks do tipo Task[] contendo as seguintes tarefas:
- Uma tarefa com id
101, title"Design user interface"e status'todo' - Uma tarefa com id
102, title"Implement authentication"e status'in-progress' - Uma tarefa com id
103, title"Deploy to production"e status'done'
Imprima as seguintes saídas:
- Chame
printTaskSummarycomfirstTask - Chame
printTaskSummarycom a segunda tarefa desampleTasks - Chame
printAllTaskSummariescomsampleTasks - Chame
printTaskSummarycom a última tarefa dedoneTasks
Experimente você mesmo
// Task interface and previous code from earlier challenges
interface Task {
id: number;
title: string;
status: 'todo' | 'in-progress' | 'done';
}
const firstTask: Task = {
id: 1,
title: "Learn TypeScript interfaces",
status: "todo"
};
const secondTask: Task = {
id: 2,
title: "Build task management app",
status: "in-progress"
};
const thirdTask: Task = {
id: 3,
title: "Write unit tests",
status: "done"
};
function getTaskInfo(task: Task): string {
return `Task ${task.id}: ${task.title} - ${task.status}`;
}
function addTask(taskList: Task[], title: string): Task[] {
const newTask: Task = {
id: taskList.length + 1,
title: title,
status: 'todo'
};
return [...taskList, newTask];
}
function changeTaskStatus(taskList: Task[], taskId: number, newStatus: 'todo' | 'in-progress' | 'done'): Task[] {
return taskList.map(task =>
task.id === taskId ? { ...task, status: newStatus } : task
);
}
const initialTasks: Task[] = [firstTask, secondTask];
const updatedTasks: Task[] = addTask(initialTasks, "Review code changes");
const testTasks: Task[] = [firstTask, secondTask, thirdTask];
const progressTasks = changeTaskStatus(testTasks, 1, 'in-progress');
const completedTasks = changeTaskStatus(progressTasks, 2, 'done');
// Create the listTasksByStatus function
function listTasksByStatus(taskList: Task[], status: 'todo' | 'in-progress' | 'done'): Task[] {
return taskList.filter(task => task.status === status);
}
// Create mixedTasks array
const mixedTasks: Task[] = [firstTask, secondTask, thirdTask];
// Filter tasks by status
const todoTasks = listTasksByStatus(mixedTasks, 'todo');
const inProgressTasks = listTasksByStatus(mixedTasks, 'in-progress');
const doneTasks = listTasksByStatus(mixedTasks, 'done');
// Print the required outputs
console.log(mixedTasks.length);
console.log(todoTasks.length);
console.log(inProgressTasks.length);
console.log(doneTasks.length);
console.log(getTaskInfo(todoTasks[0]));
console.log(getTaskInfo(inProgressTasks[0]));
console.log(getTaskInfo(doneTasks[0]));Todas as lições de Introdução ao TypeScript
1Primeiros Passos com TS
O que é TypeScript?Por que usar TypeScript?Seu Primeiro Código TypeScriptProcesso de Compilação e ErrosRecapitulação: Introdução ao TS4Trabalhando com Funções
Tipagem de Parâmetros e RetornosTipagem de Arrow FunctionsO Tipo de Retorno 'void'Parâmetros Opcionais com '?'Valores Padrão de ParâmetrosTipagem de Rest ParametersDefinindo Tipos de FunçõesRecapitulação: Criando Funções Tipadas7Projeto: Uma Lista de Tarefas Simples
Projeto: Definindo a Struct de TarefaFunção para Adicionar uma Tarefa2Tipos Principais
Tipos Básicos: str, num, booleanO Tipo 'any': Válvula de EscapeO Tipo 'unknown'Trabalhando com 'null' e 'undef'Inferência de Tipo na PráticaAnotações de Tipo ExplícitasRecapitulação: Prática de Tipos Principais5Tipos: Aliases, Uniões e Interseções
Aliases de Tipos para PrimitivosTipos de União ('|')Trabalhando com Tipos de UniãoTipos LiteraisTipos de Interseção ('&')Combinando Aliases de TiposRecapitulação: Combinações Avançadas de Tipos3Estrutura de Dados: Arrays e Tuplas
Arrays TipadosModificador 'readonly' para ArraysO que é uma Tupla?Declarando e Acessando TuplasDesestruturando TuplasTuplas ReadonlyArrays Tipados MultidimensionaisSpread Operator com ArraysRecapitulação: Arrays e TuplasPratique por conta própria: Compilador de JavaScript online