JavaScript

Objects

An object stores related data as key-value pairs, written with curly braces: const student = { name: "Ali", age: 16, isEnrolled: true };. Each key (name, age, isEnrolled) maps to a value. Access a property with dot notation, student.name, or bracket notation, student["name"] both return "Ali". Bracket notation is required when the key is stored in a variable: student[someVariable]. You can add or change a property directly: student.age = 17; updates it; student.grade = "11th"; adds a brand-new property that didn't exist before. Objects and arrays are commonly combined: an array of objects, like [{ name: "Ali" }, { name: "Sara" }], is one of the most common real-world data shapes in JavaScript it's exactly how a list of database records (covered in the MySQL course) typically arrives in your code after being fetched from a server, a topic you'll reach later in this course.

Why this matters

  • ·Objects group related properties under one clear, named container.
  • ·Dot notation makes reading and writing properties short and readable.
  • ·Arrays of objects mirror how real-world data (like a list of records) is commonly shaped in JavaScript.

Common mistakes

  • ·Accessing a property that doesn't exist returns undefined rather than causing an error, which can hide typos.
  • ·Confusing dot notation with bracket notation when the key is dynamic (stored in a variable) causes bugs.
  • ·Objects are compared by reference, not by their contents two objects with identical properties are still considered different unless they're literally the same object.
Your codeHTML
Live preview

Frequently asked questions

Dot notation (student.name) is used with a fixed, known key name. Bracket notation (student["name"] or student[someVariable]) is required when the key comes from a variable.

Practice questions

Question 1

Create an object representing a book, with title, author, and pages properties, and display all three.

Your codeHTML
Live preview

Question 2

Add a new property to an existing object and display it.

Your codeHTML
Live preview

Quick check

Just for this topic answer honestly, then check yourself.

1 / 3

Which syntax creates an object?