Skip to main content

Objects In JavaScript

Hey there! In this guide, we'll explore how to work with objects in JavaScript. Objects are collections of properties, and they play a crucial role in JavaScript programming. Let’s dive into it!

1. Creating an Object​

In JavaScript, objects can be created using object literals or constructors.

1.1 Using Object Literals​

This is the most straightforward way to create an object in JavaScript.

Example:

const person = {
  firstName: "John",
  lastName: "Doe",
  age: 30,
  greet: function () {
    console.log("Hello, " + this.firstName);
  },
};

console.log(person.firstName); // Output: John
person.greet(); // Output: Hello, John

1.2 Using the new Object() Syntax​

Another way to create an object is by using the new Object() syntax.

Example:

const person = new Object();
person.firstName = "Jane";
person.lastName = "Doe";
person.age = 25;

console.log(person.firstName); // Output: Jane

2. Accessing Object Properties​

You can access object properties using either dot notation or bracket notation.

2.1 Dot Notation​

Example:

const car = {
  make: "Toyota",
  model: "Camry",
  year: 2020,
};

console.log(car.make); // Output: Toyota

2.2 Bracket Notation​

Example:

const car = {
  make: "Toyota",
  model: "Camry",
  year: 2020,
};

console.log(car["model"]); // Output: Camry

3. Modifying Object Properties​

You can modify object properties by assigning a new value to them.

Example:

const book = {
  title: "The Great Gatsby",
  author: "F. Scott Fitzgerald",
  year: 1925,
};

book.year = 1926; // Modify the year
console.log(book.year); // Output: 1926

4. Adding and Deleting Properties​

4.1 Adding Properties​

You can add properties to an existing object at any time.

Example:

const student = {
  name: "Alice",
};

student.age = 22; // Adding a new property
console.log(student.age); // Output: 22

4.2 Deleting Properties​

You can delete a property using the delete operator.

Example:

const student = {
  name: "Alice",
  age: 22,
};

delete student.age; // Delete the age property
console.log(student.age); // Output: undefined

5. Methods in Objects​

Object methods are functions stored as object properties.

Example:

const person = {
  firstName: "John",
  lastName: "Doe",
  fullName: function () {
    return this.firstName + " " + this.lastName;
  },
};

console.log(person.fullName()); // Output: John Doe

6. Looping Through Object Properties​

You can loop through the properties of an object using a for...in loop.

Example:

const car = {
  make: "Toyota",
  model: "Camry",
  year: 2020,
};

for (let key in car) {
  console.log(key + ": " + car[key]);
}

Output:​

make: Toyota
model: Camry
year: 2020

7. Nested Objects​

Objects can contain other objects as properties.

Example:

const employee = {
  name: "John",
  position: "Developer",
  contact: {
    email: "john@example.com",
    phone: "123-456-7890",
  },
};

console.log(employee.contact.email); // Output: john@example.com

8. Checking for Properties​

You can check if an object has a specific property using the in operator or hasOwnProperty() method.

Example:

const car = {
  make: "Toyota",
  model: "Camry",
};

console.log("make" in car); // Output: true
console.log(car.hasOwnProperty("model")); // Output: true

9. Object Destructuring​

Object destructuring allows you to unpack properties from an object into variables.

Example:

const user = {
  name: "John",
  age: 30,
};

const { name, age } = user;
console.log(name); // Output: John
console.log(age); // Output: 30

Objects are the backbone of JavaScript, allowing you to model real-world entities and organize your code more effectively. Understanding how to use objects will significantly enhance your JavaScript skills.