Objects: Properties & Methods

Master the foundation of JavaScript data structures. Learn how to group related data and functionality together using key-value pairs.

JavaScript6 min readConcept 18 of 62

What is an Object?

An object is a collection of related data and/or functionality. Unlike arrays that use numbered indexes, objects use named 'keys' to store 'values'.

Think of an object like a dictionary: you look up a specific word (the key) to find its definition (the value).

Properties vs Methods

A 'Property' is just a variable attached to an object. For example, user.name = 'Alice'.

A 'Method' is a function attached to an object. For example, user.login().

Grouping these together allows you to model real-world concepts perfectly. A Car object can have properties like color and speed, and methods like drive().

Dot Notation vs Bracket Notation

The most common way to read or write to an object is **Dot Notation**: user.age = 25.

However, if the key contains spaces, special characters, or is stored inside a variable, you MUST use **Bracket Notation**: user['first name'] = 'Alice' or user[myVariable] = 25.

The Object Builder

Use Dot Notation and Bracket Notation to dynamically add, read, and delete properties from the player object.

The Object Builder

// 1. Initialize the object
const player = {
name: "Hero",
level: 1,
};
// 2. Execute Commands
(Click a button below to mutate the object)
Mutations (Pick One)
iNotice how the object updates dynamically. We MUST use bracket notation for "current weapon" because dot notation (player.current weapon) is a syntax error!

Check yourself

Pick an answer to lock it in, then read why. Getting one wrong is part of how it sticks.

  1. 1When MUST you use bracket notation instead of dot notation?
  2. 2What happens if you access `user.height` but the `height` property was never defined?
  3. 3How do you permanently remove the `score` property from a `player` object?

Remember this

  • Objects store data in key-value pairs.
  • Properties are variables on an object; Methods are functions on an object.
  • Use Dot Notation (obj.key) for simple, known keys.
  • Use Bracket Notation (obj['key']) for spaces, special characters, or dynamic variables.
  • The delete keyword removes a property entirely.

Done with this concept?

Mark it complete to track your progress. No login needed.