JavaScript
Most JavaScript project data is not just an array or just an object. It is usually an array of objects.
An object describes one thing. An array holds many things. If you get this shape right, your code becomes easier to read, test, and later replace with API data.
0 of 8 lessons done · proved by a submitted project with a public repository
Think of a hackathon project that tracks college events. One event is an object. The full event list is an array.
This same shape could later come from fetch. For now, keep it as sample data in your code.
const events = [
{
id: 1,
title: "AI Workshop",
college: "SRM Chennai",
fee: 0,
tags: ["ai", "beginner"],
registered: true
},
{
id: 2,
title: "UPI App Build Sprint",
college: "Pune Institute",
fee: 199,
tags: ["fintech", "javascript"],
registered: false
}
];
console.log(events[0].title); // AI Workshop
console.log(events[1].tags[0]); // fintechBefore writing logic, ask: what is one item, and what is the list? Draw it in comments if needed.
Use names that show the shape. event is one object. events is an array. This small habit prevents many bugs.
Do each one yourself, then tap it to tick it off. The ticks are only a checklist for you: they are not marked or scored.
0 of 5 done
In real projects, users add or change data. Practise that with sample objects before you connect an API.
Notice that the update uses id, not index. Index can change when the list is sorted or filtered.
const events = [
{ id: 1, title: "AI Workshop", fee: 0, registered: true },
{ id: 2, title: "UPI App Build Sprint", fee: 199, registered: false }
];
const newEvent = {
id: 3,
title: "Resume Review Camp",
fee: 49,
registered: false
};
const updatedEvents = [...events, newEvent];
const eventIdToRegister = 2;
const afterRegistration = updatedEvents.map((event) => {
if (event.id === eventIdToRegister) {
return { ...event, registered: true };
}
return event;
});
console.log(afterRegistration);A common beginner mistake is changing the data shape halfway. For example, fee is a number in one object and "free" as text in another.
Pick one shape and stay with it. Use fee: 0 for free events. Use registered: true or false, not "yes" and "no".
You can ask ChatGPT or Gemini to create sample data for your project. Ask for an array of objects with exact fields.
Then check every object yourself. Make sure field names match, ids are unique, and values use the same types.
Prompt:
Create 8 sample events for a JavaScript college hackathon app.
Return only a JavaScript array of objects.
Each object must have: id number, title string, college string, fee number, tags array of strings, registered boolean.Do each one yourself, then tap it to tick it off. The ticks are only a checklist for you: they are not marked or scored.
0 of 5 done
Answer the quick check to finish this lesson.