Arrays, objects, and data modeling

What you will build

Represent a study record as an object and manage records in an array.

Understand the idea first

Represent a study record as an object and manage records in an array.

Build it step by step

const sessions = [
  { id: 1, topic: 'HTML 结构', minutes: 35, done: true },
  { id: 2, topic: 'CSS Grid', minutes: 45, done: false },
];
const totalMinutes = sessions.reduce((sum, item) => sum + item.minutes, 0);

1. Open the project from the previous lesson and record its current result.
2. Type and run the example, then complete this task: Add two real records; use map for topics, filter for completed items, and reduce for total minutes.
3. Change at least one input, predict the result, and verify it.
4. Create and repair this lesson's typical failure: Do not use array position as a permanent id; store a stable id.

Read the important lines

• Represent a study record as an object and manage records in an array.
• Read the code as input, processing, and output; point to each part.
• A first successful run is not enough; verify a different input and an edge case.

Common mistakes and what to check

Practice without copying

Add two real records; use map for topics, filter for completed items, and reduce for total minutes.

Completion check

• I produced the required visible result
• I can explain the input, processing, and output
• I tested normal, edge, and failure cases