module-2.7-asynchronous-object-oriented-programming.md

Module 2.7: Asynchronous Object-Oriented Programming

In this module, you will explore how to apply object-oriented programming (OOP) principles in an asynchronous context in JavaScript. Asynchronous programming is essential for handling operations that take time, such as fetching data from a server or handling user interactions without blocking the main thread. This module will demonstrate how to structure asynchronous code using OOP concepts. Let's dive into the world of asynchronous OOP with examples.

Using Promises

Promises are a crucial part of handling asynchronous operations in JavaScript. You can encapsulate asynchronous tasks within methods or functions in your classes. Here's an example:

class DataService {
  fetchData(url) {
    return new Promise((resolve, reject) => {
      fetch(url)
        .then((response) => response.json())
        .then((data) => resolve(data))
        .catch((error) => reject(error));
    });
  }
}

const dataService = new DataService();
dataService.fetchData('https://jsonplaceholder.typicode.com/posts/1')
  .then((data) => {
    console.log(data);
  })
  .catch((error) => {
    console.error(error);
  });

Asynchronous Methods in Classes

You can define methods within your classes that perform asynchronous operations, allowing you to create more structured and organized code.

class UserManager {
  constructor() {
    this.users = [];
  }

  async fetchUserData(id) {
    const response = await fetch(`https://jsonplaceholder.typicode.com/users/${id}`);
    const user = await response.json();
    this.users.push(user);
  }
}

const userManager = new UserManager();
userManager.fetchUserData(1)
  .then(() => {
    console.log(userManager.users);
  })
  .catch((error) => {
    console.error(error);
  });

Chaining Promises

You can create chains of asynchronous operations in a class, where each method returns a promise, making your code more readable and maintainable.

class TaskManager {
  async startTask() {
    return 'Task started';
  }

  async performTask(task) {
    return `Performing ${task}`;
  }

  async finishTask(task) {
    return `Finished ${task}`;
  }

  async executeTask() {
    return this.startTask()
      .then((task) => this.performTask(task))
      .then((task) => this.finishTask(task));
  }
}

const taskManager = new TaskManager();
taskManager.executeTask()
  .then((result) => {
    console.log(result);
  })
  .catch((error) => {
    console.error(error);
  });

These examples demonstrate how to apply OOP principles to asynchronous programming in JavaScript using Promises. This allows you to create structured and maintainable code that handles asynchronous tasks effectively.