Menu
Coddy logo textTech

関数:タスクの概要を出力する

CoddyのJavaScriptジャーニー「Introduction To TypeScript」セクションの一部。レッスン 49/73。

challenge icon

チャレンジ

簡単

前のチャレンジから、以下の内容が提供されています:

  • id (number)、title (string)、および status (リテラル型) を持つ Task インターフェース
  • 3つのタスク変数:firstTasksecondTask、および thirdTask
  • getTaskInfo 関数
  • addTask 関数
  • changeTaskStatus 関数
  • listTasksByStatus 関数
  • initialTasksupdatedTaskstestTasksprogressTaskscompletedTasksmixedTaskstodoTasksinProgressTasks、および doneTasks 配列

1つのパラメータを受け取る printTaskSummary という名前の関数を作成してください:

  • Task 型の task (単一の Task オブジェクト)

この関数は以下を行う必要があります:

  • コンソールに "ID: [id], Title: [title], Status: [status]" という正確な形式でフォーマットされたサマリーを出力する
  • 戻り値の型を void にする

1つのパラメータを受け取る printAllTaskSummaries という名前の関数を作成してください:

  • Task[] 型の taskList (Task オブジェクトの配列)

この関数は以下を行う必要があります:

  • ループを使用して、配列内の各タスクに対して printTaskSummary を呼び出す
  • 戻り値の型を void にする

以下のタスクを含む Task[] 型の sampleTasks という名前の変数を作成してください:

  • id が 101、title が "Design user interface"、status が 'todo' のタスク
  • id が 102、title が "Implement authentication"、status が 'in-progress' のタスク
  • id が 103、title が "Deploy to production"、status が 'done' のタスク

以下の出力を表示してください:

  • firstTask を引数にして printTaskSummary を呼び出す
  • sampleTasks の2番目のタスクを引数にして printTaskSummary を呼び出す
  • sampleTasks を引数にして printAllTaskSummaries を呼び出す
  • doneTasks の最後のタスクを引数にして printTaskSummary を呼び出す

自分で試してみよう

// 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]));

Introduction To TypeScriptのすべてのレッスン

自分で練習してみよう: JavaScriptオンラインコンパイラ