4.4 — Objects
Arrays answer “give me element number 2” — perfect when order is the point. But describe one book with an array and you get ["The Hobbit", 310, true]… and a quiz: what did position 1 mean again? Pages? Rating? Data about one thing has parts with names, not positions.
An object stores properties — key: value pairs — under one name, and you fetch each value by its key: book.title, never “whatever sits third.” Arrays for many-of-the-same in order; objects for one-thing-with-named-parts.
Nearly every piece of data your future tests receive is built from these two, nested into each other.
const book = {
title: "The Hobbit",
pages: 310,
author: { name: "Tolkien", born: 1892 },
};
console.log(book.title);
console.log(book.author.name);
console.log(book["pages"]);
book.rating = 5;
console.log(book.publisher);Curly braces build the object. Each property is a key → value pair: title holds "The Hobbit", pages holds 310 — and author holds a whole OTHER OBJECT as its value. Values can be anything, including more objects; that’s how real-world data gets its shape.
The deeper story, with the real names for things — this part is what turns “I saw it” into “I can explain it.”
Property keys are strings under the hood — { title: … } is shorthand for { "title": … }. That is why any text can be a key, including "favorite toy" with a space (reachable only through brackets). Dot access is just bracket access with the string fixed at writing time: book.title and book["title"] are the same lookup.
The two access styles split one job. Dot: you know the key while writing the code. Brackets: the key arrives at runtime — in a variable, from user input, built from other strings.
Writing works through both, and writing to a missing key creates it; reading a missing key returns undefined without complaint.
Fun fact: a paper dictionary works exactly like an object. Nobody asks for “the word on page 412” (position); you look up pizza (the key) and read its definition (the value). Other languages even name this structure a dictionary — JavaScript just says object.
⌨️ a record with a birthday
Model a pet as an object, celebrate its birthday by computing from what the object already knows, and attach a property whose key contains a space.
requirements:
- Create an object named
petwith three properties, in this order:name="Biscuit",kind="hamster",age=2. - Birthday! Increase
pet.ageby 1 — computed from its current value, not typed as a fresh number. - Add a brand-new property whose key is
favorite toy(yes, with the space) and value"tiny wheel". Choose your accessor accordingly. - Print
pet.name, then print the whole object.
when you press RUN, the console must show exactly:
✏️ Quick check 1
Type exactly what this prints:
const user = { name: "Mia", age: 30 };
const k = "age";
console.log(user[k]);✏️ Quick check 2
Type exactly what this prints:
const user = { name: "Mia" };
console.log(user.email);✏️ Quick check 3
Type exactly what this prints:
const cfg = { theme: { dark: true } };
console.log(cfg.theme.dark);🗣️ Now teach it back
A friend asks: “when do I use book.title and when book[something]? Aren’t they the same?” Explain the real difference — and what happens when the property doesn’t exist.
Write it as if your friend is sitting next to you. Saved to your journal — future-you will use these notes to teach others.