Object Basics and Properties0%
Iterating over Arrays and Objects

Object Basics and Properties

Beginner12 min read•Updated: Jul 11, 2026
Study Materials

Object Basics and Properties in JavaScript

If arrays are ordered lists, Objects are structured dictionaries. Objects in JavaScript allow you to group related state and behavior into a single data structure composed of key-value pairs (also called properties and methods).

1. Creating Objects: Object Literal Syntax

The simplest and most common way to create an object is using curly braces { ... }:

JavaScript
const student = {
// Properties (key: value)
firstName: "Sumit",
lastName: "Sharma",
age: 24,
isEnrolled: true,
skills: ["HTML", "CSS", "JavaScript"],
address: {
city: "New Delhi",
country: "India"
},
 
// Method (function inside an object)
getFullName: function() {
return `${this.firstName} ${this.lastName}`;
}
};

2. Accessing and Modifying Properties

JavaScript offers two ways to access object properties:

A. Dot Notation (object.property)

Clean, standard, and easy to read:

JavaScript
console.log(student.firstName); // "Sumit"
console.log(student.address.city); // "New Delhi"
 
// Calling a method:
console.log(student.getFullName()); // "Sumit Sharma"

B. Bracket Notation (object["property"])

Mandatory in two critical scenarios:

  1. 1
    When property names contain spaces or hyphens:
JavaScript
const config = { "api-version": "v2", "max retries": 3 };
console.log(config["api-version"]); // Valid! config.api-version would fail!
  1. 1
    When the property key is stored in a dynamic variable:
JavaScript
const keyToLookUp = "age";
console.log(student[keyToLookUp]); // 24!
// student.keyToLookUp would look literally for a property named 'keyToLookUp'!

3. Adding, Updating, and Deleting Properties

Objects in JavaScript are dynamic:

JavaScript
const course = {
title: "Full-Stack Development",
duration: "6 months"
};
 
// 1. Updating an existing property:
course.duration = "12 months";
 
// 2. Adding a brand new property:
course.instructor = "Sumit Sir";
course.rating = 4.9;
 
// 3. Deleting a property using the 'delete' keyword:
delete course.rating;
 
console.log(course);
// { title: "Full-Stack Development", duration: "12 months", instructor: "Sumit Sir" }

4. Checking if a Property Exists

JavaScript
const user = { name: "Aarav", email: "aarav@gmail.com" };
 
// 1. The 'in' operator:
console.log("email" in user); // true
console.log("phoneNumber" in user); // false
 
// 2. Object.hasOwn() (Modern ES2022 standard):
console.log(Object.hasOwn(user, "name")); // true

5. The this Keyword Inside Object Methods

When a function is called as a method of an object, this refers to the object itself:

JavaScript
const car = {
brand: "Tesla",
speed: 60,
accelerate() {
this.speed += 20;
console.log(`${this.brand} is now moving at ${this.speed} km/h.`);
}
};
 
car.accelerate(); // "Tesla is now moving at 80 km/h."
Interactive Quiz

Practice Quiz

Question 1
What data structure does a JavaScript object use to store data?
Question 2
When MUST you use bracket notation (obj[key]) instead of dot notation (obj.key)?
Question 3
What keyword is used to remove a property from an object in JavaScript?
Question 4
Inside an object method, what does the this keyword refer to when invoked normally?
Question 5
What is the modern ES2022 method to safely check if an object owns a specific property key?
Next Lesson

Iterating over Arrays and Objects

Continue learning with hands-on practice, examples, and exercises in the upcoming topic.

Related Lessons

Previous LessonNext Lesson
Array Basics and MethodsIterating over Arrays and Objects

Practice Quiz

Test your understanding of this lesson with 5 questions. Each question has one correct answer.

PreviousNext
PrevNext