Object Basics

Objects are the core data structure of JavaScript — collections of key/value pairs that let you model real-world things as a single, named bundle of data and behavior. Almost everything in the language builds on them: arrays, functions, dates, and even the DOM are all objects under the hood. Understanding how to create objects, read and change their properties, and nest them is the foundation for nearly every program you will write.

Creating objects with literals

The most common way to make an object is the object literal — a comma-separated list of key: value pairs inside curly braces. Keys (also called properties) are strings; the values can be any type, including numbers, strings, booleans, arrays, other objects, or functions.

const user = {
  name: "Ada Lovelace",
  age: 36,
  isAdmin: true,
  languages: ["JavaScript", "Python"],
};

console.log(user.name);
console.log(user.languages.length);

Output:

Ada Lovelace
2

When a property key contains spaces or special characters, wrap it in quotes: { "first name": "Ada" }. Otherwise the quotes are optional and usually omitted.

Accessing properties: dot vs bracket

There are two ways to read or set a property. Dot notation is concise and is what you will use most of the time. Bracket notation takes a string (or an expression that evaluates to a string) and is required when the key is dynamic or isn’t a valid identifier.

const product = { title: "Keyboard", "list-price": 79.99 };

console.log(product.title); // dot notation
console.log(product["title"]); // equivalent bracket notation
console.log(product["list-price"]); // bracket required: invalid identifier

const key = "title";
console.log(product[key]); // dynamic key from a variable

Output:

Keyboard
Keyboard
79.99
Keyboard

Feature	Dot notation	Bracket notation
Syntax	obj.key	obj["key"]
Key must be a valid identifier	Yes	No
Supports dynamic/computed keys	No	Yes
Typical use	Known, fixed keys	Variable keys, special characters

Reading a property that doesn’t exist returns undefined rather than throwing an error — so user.email on the object above gives undefined, not a crash.

Adding, updating, and deleting properties

Objects created with const are still mutable — const only prevents reassigning the variable itself, not changing the object’s contents. You can add a property simply by assigning to a new key, update one by assigning to an existing key, and remove one with the delete operator.

const car = { make: "Toyota" };

car.model = "Corolla"; // add
car.make = "Honda"; // update
car["year"] = 2024; // add via bracket
delete car.model; // delete

console.log(car);
console.log("model" in car);

Output:

{ make: 'Honda', year: 2024 }
false

The in operator checks whether a key exists on an object, which is more reliable than comparing to undefined (a property can legitimately hold the value undefined).

Nested objects

Property values can themselves be objects or arrays, letting you build rich, hierarchical data. You access deeper levels by chaining dot or bracket accessors.

const order = {
  id: 1024,
  customer: {
    name: "Grace Hopper",
    address: {
      city: "New York",
      zip: "10001",
    },
  },
  items: [{ sku: "A1", qty: 2 }],
};

console.log(order.customer.address.city);
console.log(order.items[0].sku);

Output:

New York
A1

If any intermediate value might be missing, reaching through it (order.shipping.city) throws a TypeError. Optional chaining (order.shipping?.city) safely short-circuits to undefined instead — covered in its own topic.

Methods: functions as properties

A property whose value is a function is called a method. The shorthand method syntax (greet() { ... }) is the modern way to define them. Inside a method, the this keyword refers to the object the method was called on, so it can read sibling properties.

const account = {
  owner: "Linus",
  balance: 100,
  deposit(amount) {
    this.balance += amount;
    return this.balance;
  },
  describe() {
    return `${this.owner} has $${this.balance}`;
  },
};

console.log(account.deposit(50));
console.log(account.describe());

▶ Open in CodePen

Output:

150
Linus has $150

How this is determined is one of JavaScript’s subtler topics — when a method is detached from its object or used as a callback, this can change. See the dedicated page on methods and this for the full picture.

Best practices

• Prefer object literals for fixed-shape data; they are concise and the most readable way to create objects.
• Use dot notation by default and reserve bracket notation for dynamic keys or non-identifier property names.
• Keep const for object variables you do not reassign — you can still mutate their contents freely.
• Use the in operator (or Object.hasOwn(obj, key)) to test for a property’s existence instead of comparing to undefined.
• Reach for optional chaining (?.) when traversing nested structures that may have missing levels.
• Define behavior with method shorthand and access related state through this rather than hard-coding values.

Related Topics

• Object methods and this
• Computed properties
• Object destructuring
• Optional chaining
• JSON